Auto-compléter une liste des checkboxes

Version imprimable

30/05/2016, 23h55
Invité

Auto-compléter une liste des checkboxes

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. :arf:

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 :help:

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 :merci:
31/05/2016, 13h14
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
31/05/2016, 19h54
Invité

Désolé, je ne trouve pas comment supprimer le sujet, j'ai déjà trouvé la solution.
31/05/2016, 21h20
NoSmoking

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

Oui, avec plaisir :D

Voici le code jQuery :

Code:

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();
			}
		});
	});
}