bootstrap multiselect получить выбранные значения

Как вернуться к onChange все выбранные значения в раскрывающемся списке мультиселектов. Используется плагин here. Попытка использовать следующее, но я думаю, что я на ложном путиbootstrap multiselect получить выбранные значения

$('#multiselect1').multiselect({ 
     selectAllValue: 'multiselect-all', 
     enableCaseInsensitiveFiltering: true, 
     enableFiltering: true, 
     maxHeight: '300', 
     buttonWidth: '235', 
     onChange: function(element, checked) { 
      var brands = $('#multiselect1 option:selected'); 
      var selection = []; 
      $(brands).each(function(index, brand){ 
       selection.push(brand); 
      }); 

      console.log(selection); 
     } 
    });

нашел его

$('#multiselect1').multiselect({ 
    selectAllValue: 'multiselect-all', 
    enableCaseInsensitiveFiltering: true, 
    enableFiltering: true, 
    maxHeight: '300', 
    buttonWidth: '235', 
    onChange: function(element, checked) { 
     var brands = $('#multiselect1 option:selected'); 
     var selected = []; 
     $(brands).each(function(index, brand){ 
      selected.push([$(this).val()]); 
     }); 

     console.log(selected); 
    } 
});

источник

2013-12-11 fefe

решение, что я нашел, чтобы работать в моем случае

$('#multiselect1').multiselect({ 
    selectAllValue: 'multiselect-all', 
    enableCaseInsensitiveFiltering: true, 
    enableFiltering: true, 
    maxHeight: '300', 
    buttonWidth: '235', 
    onChange: function(element, checked) { 
     var brands = $('#multiselect1 option:selected'); 
     var selected = []; 
     $(brands).each(function(index, brand){ 
      selected.push([$(this).val()]); 
     }); 

     console.log(selected); 
    } 
});

источник

2014-04-22 08:06:42 fefe

+1 для решения, однако у вас есть ошибка в вашем заявлении selected.push. вы нажимаете список значения параметра, а не значение как строку. вы хотите удалить прилагаемые скобки. – tbradley22

Сокращенный вариант:

$('#multiselect1').multiselect({ 
    ... 
    onChange: function() { 
     console.log($('#multiselect1').val()); 
    } 
});

источник

2015-11-14 15:30:19

Блестящий! Большое спасибо. – adamj

К сожалению, это не работает в IE11 – AlexM

Работал в IE11 для меня –

более эффективным, благодаря меньшему DOM: поиски

$('#multiselect1').multiselect({ 
    // ... 
    onChange: function() { 
     var selected = this.$select.val(); 
     // ... 
    } 
});

источник

2016-03-05 09:32:20 eagor

В вашей странице Html пожалуйста добавьте

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Test the multiselect with ajax</title> 

    <!-- Bootstrap --> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"> 
    <!-- Bootstrap multiselect --> 
    <link rel="stylesheet" href="http://davidstutz.github.io/bootstrap-multiselect/dist/css/bootstrap-multiselect.css"> 

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
    <!--[if lt IE 9]> 
     <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.2/html5shiv.js"></script> 
     <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> 
    <![endif]--> 
    </head> 
    <body> 
    <div class="container"> 
     <br> 

     <form method="post" id="myForm"> 

     <!-- Build your select: --> 
     <select name="categories[]" id="example-getting-started" multiple="multiple" class="col-md-12"> 
      <option value="A">Cheese</option> 
      <option value="B">Tomatoes</option> 
      <option value="C">Mozzarella</option> 
      <option value="D">Mushrooms</option> 
      <option value="E">Pepperoni</option> 
      <option value="F">Onions</option> 
      <option value="G">10</option> 
      <option value="H">11</option> 
      <option value="I">12</option> 
     </select> 
     <br><br> 
     <button type="button" class="btnSubmit"> Send </button> 

     </form> 

     <br><br> 
     <div id="result">result</div> 
    </div><!--container--> 

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <!-- Include all compiled plugins (below), or include individual files as needed --> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
    <!-- Bootstrap multiselect --> 
    <script src="http://davidstutz.github.io/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script> 

    <!-- Bootstrap multiselect --> 
    <script src="ajax.js"></script> 

    <!-- Initialize the plugin: --> 
    <script type="text/javascript"> 
     $(document).ready(function() { 

     $('#example-getting-started').multiselect(); 

     }); 
    </script> 

    </body> 
</html>

В вашей ajax.js страницы, пожалуйста, добавьте

$(document).ready(function() { 
    $(".btnSubmit").on('click',(function(event) { 
    var formData = new FormData($('#myForm')[0]); 
    $.ajax({ 
     url: "action.php", 
     type: "POST", 
     data: formData, 
     contentType: false, 
     cache: false, 
     processData:false, 
     success: function(data) 
     { 
     $("#result").html(data); 

     // To clear the selected options 
     var select = $("#example-getting-started"); 
     select.children().remove(); 
     if (data.d) { 
      $(data.d).each(function(key,value) { 
      $("#example-getting-started").append($("<option></option>").val(value.State_id).html(value.State_name)); 
      }); 
     } 
     $('#example-getting-started').multiselect({includeSelectAllOption: true}); 
     $("#example-getting-started").multiselect('refresh'); 

     }, 
     error: function() 
     { 
     console.log("failed to send the data"); 
     } 
    }); 
    })); 
});

В вашем действии. php page add

echo "<b>You selected :</b>"; 

    for($i=0;$i<=count($_POST['categories']);$i++){ 

    echo $_POST['categories'][$i]."<br>"; 

    }

источник

2016-05-15 20:46:51 Astm

$('#multiselect1').on('change', function(){ 
    var selected = $(this).find("option:selected"); 
    var arrSelected = []; 
    selected.each(function(){ 
     arrSelected.push($(this).val()); 
    }); 
});

источник

2016-09-20 07:30:43

bootstrap multiselect получить выбранные значения

ответ

Смежные вопросы