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