Discussion :

[Invité]

Bonjour / Bonsoir,

J'ai un script en javascript pure permettant d’auto-compléter une liste des checkboxes, mais malheureusement il ne fonctionne pas sur les IE < 9, j'ai essayé les polyfill et autres méthodes mais sans résultats.

JavaScript

Du coup on m'a conseillé de le faire en jQuery, j'ai trouvé une description sur le site officiel jQueryAPI, mais je sais pas comment appliquer le code sur mon cas vu que je suis débutant en JS/jQuery

Description API

Je me permets de vous demander comment procéder pour écrire le script en se basant sur ce code HTML/CSS:

Template

Je serai très reconnaissant de vos aides

[NoSmoking]

Bonjour,
pourquoi ouvrir une nouvelle discussion et ne pas répondre à celle déjà en cours pour le même problème ?

Pour mémoire : Filtrer une liste des checkboxes

[Invité]

Désolé, je ne trouve pas comment supprimer le sujet, j'ai déjà trouvé la solution.

[NoSmoking]

Peut être que dans un premier temps tu pourrais nous faire profiter de ta solution

[Invité]

Oui, avec plaisir

Voici le code jQuery :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
function filtrerAptitudes() {
 
	jQuery('#filtreMultiAptitudes').on('keyup',function(){
		var search_txt = jQuery.trim(jQuery(this).val()).sansAccent().toLowerCase();
		jQuery('.item-search').each(function(){
			var current_txt = jQuery.trim(jQuery(this).text().sansAccent().toLowerCase());
 
			if(current_txt.indexOf(search_txt) >= 0)
				jQuery(this).parent().attr('data-val','1').css('display','block');
			else
				jQuery(this).parent().attr('data-val','0').css('display','none');
		});
 
		jQuery('.categorieDesAptitudes').each(function(k,v){
			var total_labels = jQuery(this).children('.aptitudesDeLaCategorie').children('label').length;
			var hidden_labels = jQuery(this).children('.aptitudesDeLaCategorie').children('label[data-val="0"]').length;
			if(total_labels == hidden_labels){
				jQuery(this).hide();
			}else{
				jQuery(this).show();
			}
		});
	});
}