Limite el número de interruptores activados en bootstrap

Question

Actualmente estoy usando http://www.bootstrap-switch.org/ hay un script para que yo puede limitar la cantidad de interruptores alternados. Aqui esta mi codigo

<script type="text/javascript">
  $(function(argument) {
    $('[type="checkbox"]').bootstrapSwitch();
    var limit = 5;
    $('[type="checkbox"]').on('switchChange.bootstrapSwitch', function(event, state) {
      //event listener
    });
  });
</script>

 <input type="checkbox">
 <input type="checkbox">
 <input type="checkbox">
 <input type="checkbox">
 <input type="checkbox">

Por favor, déjame tener alguna idea sobre cómo hacer esto. Gracias

javascript jquery twitter-bootstrap

0

Erwin Daez 10 dic. 2015 a las 07:42

Answer 1

Agregue un controlador de eventos adicional para el evento de clic, que puede cancelar el cambioCambiar antes de que active BootstrapSwitch. Me gusta esto :

$('[type="checkbox"]').on('click',function(e) {
       if($(this).siblings(':checked').length >= limit) {
         e.preventDefault();
         alert("You have already reached the limit");
         return false;
       }
});

1

Tᴀʀᴇǫ Mᴀʜᴍᴏᴏᴅ 10 dic. 2015 a las 05:27

Answer 2

Haz algo como esto

var limit = 5;
$('[type="checkbox"]').on('switchChange.bootstrapSwitch', function(event, state) {
    if($('[type="checkbox"]:checked').length > limit ) {
        alert('You are allowed to check '+limit+' options'); /*show alert when more than limit are selected*/
        $(this).prop('checked', false); /* uncheck the last one checked*/
    }
});

1

Gautham 10 dic. 2015 a las 05:36

Answer 3

Tratar:

 $('[type="checkbox"]').bootstrapSwitch();

 var limit = 2;
 $('[type="checkbox"]').on('switchChange.bootstrapSwitch', function(event, state) {

   if ($('[type="checkbox"]:checked').length > limit) {
     $(this).bootstrapSwitch('state', !state, true);
     alert('You are allowed to check a maximum of ' + limit + ' options')
   }
 });

Jsfiddle: https://jsfiddle.net/Lj1v6nvs/1/

1

madalinivascu 10 dic. 2015 a las 05:29

Limite el número de interruptores activados en bootstrap

3 respuestas

Preguntas relacionadas

Nuevas preguntas

javascript