Jquery Mobile / select multiple / Uncheck
Bonjour,
Je suis actuellement sur du Jquery mobile (version 1.3.0).
J'utilise un select multiple, contenant par exemple ceci :
Animaux
cheval
mouton
boeuf
etc
Objet
Table
lampe
etc
Je souhaite que pour chaque catégorie (Animaux/Objet/...) 2 critères maximum peuvent être choisi.
J'ai deux solutions d'affichage et toutes deux on des problèmes :
Soit la solution A avec :
Code:
data-native-menu="true"
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
| <select name="Selector" id="Selector" multiple="multiple" data-native-menu="true" data-overlay-theme="c" data-theme="c" data-icon="grid" data-iconpos="left">
<optgroup label="Animaux">
<option value="cheval" selected="selected">cheval</option>
<option value="mouton">mouton</option>
<option value="boeuf">boeuf</option>
<option value="etc">etc</option>
</optgroup>
<optgroup label="Objet">
<option value="Table">Table</option>
<option value="lampe">lampe</option>
<option value="etc">etc</option>
</optgroup>
</select> |
Soit la solution B : la même chose que la solution A mais avec :
Code:
data-native-menu="false"
Puis pour le javascript, quelque chose comme ça : (ici c'est pour l'exemple, et ce n'est pas le sujet du problème. ça déselection l'option si on a plus de 2 elements séléctionné sur la totalité du select)
Code:
1
2
3
4
5
6
7
8
9
| var last_valid_selection = null;
$('#Selector').change(function(event) {
if ($(this).val().length > 2) {
$(this).val(last_valid_selection);
$('#Selector').selectmenu("refresh");
} else {
last_valid_selection = $(this).val();
}
}); |
Solution A :
Affichage correcte, la sélection d'un critère ne se fait pas si on dépasse 2 critères. Très bien, par contre c'est extrêmement lent. L'attente est d'au moins 1sec entre le "click" et l'affichage de la sélection (sur un iphone 5... ce n'est pas normal)
Solution B :
Affichage correcte, rapidité au TOP puisqu'on utilise l'affichage natif de l'OS (comme ceci : http://adressedequentin.files.wordpr...3893.png?w=208)
Par contre sur cette solution, on peut cocher autant de critères que l'on souhaite... Du moins pour l'affichage car si on quitte la liste déroulante et qu'on revient dessus ALORS on a bien que deux critères sélectionné.
Le problème ici est donc de décocher (ou de ne pas cocher dès le départ) le critère de trop sans à avoir à quitter la liste déroulante et a revenir pour avoir un affichage correcte.
Alors voilà, si vous avez une résolution à mon problème (à au moins une des deux solution) je suis preneur.
J'espère avoir été clair :s
Merci d'avance :)
