Code pour définir/annuler case à cocher boutons dans le Bootstrap 3.0
J'ai essayé d'utiliser un bouton de groupe (selon les directives au http://getbootstrap.com/javascript/#buttons), puis d'analyser leurs valeurs dans un décalée tableau:
Code pour le btn-group
<div class="btn-group" id="weekdays" data-toggle="buttons">
<label class="btn btn-default">
<input type="checkbox" >Mo
</label>
<label class="btn btn-default">
<input type="checkbox">Tu
</label>
<label class="btn btn-default">
<input type="checkbox">We
</label>
</div>
</div>
Code pour la lecture des valeurs
$("#weekdays ").change(function(event){
var checkedDays = $("#weekdays :checkbox").map(function(){
return $(this).is(':checked') ? 1 : 0;
}).get(); //<----
var sun = checkedDays.pop();
checkedDays.unshift(sun);
console.log(checkedDays);
});
So far So good. (Même si je suis sûr que le code pourrait être mieux écrit.)
Cependant, mon problème c'est quand j'essaie de ensemble les valeurs des cases à cocher par programmation, et d'obtenir que cela se reflétait dans l'INTERFACE utilisateur. J'ai sorte de réussi à changer les valeurs des cases à cocher à l'aide d'un certain nombre de méthodes $(this).prop('checked', true)
, etc, ce qui semble pour mettre à jour la sauvegarde des valeurs, mais il ne fait rien pour changer l'apparence des boutons.
J'ai vu un certain nombre de solutions, mais aucun qui fonctionne avec le Bootstrap 3.0 recommandé de configurer la case btn-group
. Quelqu'un aurait-il une solution?
OriginalL'auteur uvesten | 2013-09-25
Vous devez vous connecter pour publier un commentaire.
Si vous utilisez l'un DOM de l'éditeur en cliquant sur le Bootstrap boutons, vous verrez qu'une classe
active
est ajouté à l'étiquette (pas de la case d'entrée) lorsque le bouton est cliqué.Par programmation de la bascule les boutons, utiliser le Bootstrap
.bouton('toggle')
méthode sur l'étiquette:http://jsfiddle.net/mblase75/4NVvj/
Cela va changer à la fois l'apparence du bouton et de la
checked
propriété de la case de l'intérieur.OriginalL'auteur Blazemonger
Dans un cas analogue à ce qui a fonctionné pour moi:
Qui fait exactement ce que vous voulez.
PS. Vous ne savez pas si il est le meilleur, mais il a travaillé pour moi.
OriginalL'auteur Syd