Bonjour, j'utilise le code ici :
http://khayyam.developpez.com/tutori...y/multiselect/
Sur le rendu, ça marche plutôt bien (j'ai choisi le premier exemple du .html)
Puisque j'ai débuté le jQuery hier (par intérêt pour mon projet et non dans une volonté spécifique d'apprentissage), je ne comprends pas bien le code et je ne sais pas comment réparer, surtout qu'il n'y a pas d'erreur dans la console.
Ce qui ne fonctionne pas, c'est qu'il y a une checkbox "select All" qui ne marche qu'au premier click. Elle désélectionne tout, mais ne re-selectionne pas lorsqu'on reclique dessus.
J'ai pu déterminer que les fonctions appelées dans le .js était celui-ci :
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 // Handle Select All $(select).next('.multiSelect').next('.multiSelectOptions').find('INPUT.selectAll').click( function() { alert("test2"); if( $(this).attr('checked') == true ) $(this).parent().parent().find('INPUT:checkbox').attr('checked', true).parent().addClass('checked'); else $(this).parent().parent().find('INPUT:checkbox').attr('checked', false).parent().removeClass('checked'); }); // Handle checkboxes $(select).next('.multiSelect').next('.multiSelectOptions').find('INPUT:checkbox').click( function() { alert("test1"); $(this).parent().parent().multiSelectUpdateSelected(o); $(this).parent().parent().find('LABEL').removeClass('checked').find('INPUT:checked').parent().addClass('checked'); $(this).parent().parent().prev('.multiSelect').focus(); if( !$(this).attr('checked') ) $(this).parent().parent().find('INPUT:checkbox.selectAll').attr('checked', false).parent().removeClass('checked'); if( callback ) callback($(this)); }); // Initial display $(select).next('.multiSelect').next('.multiSelectOptions').each( function() { alert("test3"); $(this).multiSelectUpdateSelected(o); $(this).find('INPUT:checked').parent().addClass('checked'); });
De plus, voici le html :
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
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50 <body> <form action="" method="post"> <p> <select id="control_1" name="control_1[]" multiple="multiple" size="5"> <option value=""></option> <option value="option_1">Option 1</option> <option value="option_2">Option 2</option> <option value="option_3">Option 3</option> <option value="option_4">Option 4</option> <option value="option_5">Option 5</option> </select> </p> </form> <script type="text/javascript"> $(document).ready( function() { // Default options $("#control_1, #control_3, #control_4, #control_5").multiSelect(); // With callback $("#control_6").multiSelect( null, function(el) { $("#callbackResult").show().fadeOut(); }); // Options displayed in comma-separated list $("#control_7").multiSelect({ oneOrMoreSelected: '*' }); // 'Select All' text changed $("#control_8").multiSelect({ selectAllText: 'Pick ‘em all!' }); // Show test data $("FORM").submit( function() { var results = $(this).serialize().replace(/&/g, '\n'); results = decodeURI(results); alert(results); return false; }); }); </script> ....
Si quelqu'un veut bien jeter un coup d'oeilMerci
Partager