web-dev-qa-db-fra.com

Obtenir la valeur actuelle dans bootstrap-select

J'ai utilisé e.target.value pour récupérer la valeur actuellement sélectionnée à partir de bootstrap-select, mais la première valeur sélectionnée a été renvoyée, c’est-à-dire que l’alerte a continué d’afficher l’élément 1, lorsque l’élément 1 et l’élément 2 étaient sélectionnés même lorsque l’élément 2 était le dernier sélectionné.

Comment puis-je obtenir la valeur pour la sélection récente et comment obtenir combien d'options sont sélectionnées?

   <select multiple class="selectpicker" multiple data-selected-text-format="count > 1">
    <option value="item 1">Item 1</option>
    <option value="item 2">Item 2</option>
    <option value="item 3">Item 3</option>
    <option value="item 4">Item 4</option>
    <option value="item 5">Item 5</option>

$('.selectpicker').change(function (e) {
    alert(e.target.value);
});
javascriptjquerytwitter-bootstraphtml-selectbootstrap-select
17
Gene9y

Je pense que la réponse peut être plus facile à comprendre comme ceci:

$('#empid').on('click',function() {
  alert($(this).val());
  console.log($(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<select id="empid" name="empname" multiple="multiple">
  <option value="0">item0</option>
  <option value="1">item1</option>
  <option value="2">item2</option>
  <option value="3">item3</option>
  <option value="4">item4</option>
</select>
<br />
Hold CTRL / CMD for selecting multiple fields

Si vous sélectionnez "item1" et "item2" dans la liste, le résultat sera "1,2".

25
Mirza Obaid

au lieu de e.target.value, vous pouvez utiliser $(this).find("option:selected").text();

 $('.selectpicker').change(function () {
        var selectedItem = $('.selectpicker').val();
        alert(selectedItem);
    });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>


<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap-select.min.css">

<!-- Latest compiled and minified JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap-select.min.js"></script>


<select class="selectpicker" multiple data-selected-text-format="count > 1">
        <option value="1">Item 1</option>
        <option value="2">Item 2</option>
        <option value="3">Item 3</option>
        <option value="4">Item 4</option>
        <option value="5">Item 5</option>
</select>
17
kritikaTalwar
$('.selectpicker').on('change', function(){
    var selected = []
    selected = $('.selectpicker').val()
    console.log(selected); //Get the multiple values selected in an array
    console.log(selected.length); //Length of the array
});
7
akshat

Selon ce post , vous devriez faire quelque chose comme:

$('.selectpicker').on('changed.bs.select', function (e) {
    var selected = e.target.value;
});
4
Jean Dok

C'est la solution:

$('#payment_method').on('hidden.bs.select', function (e) {
  // console.log(e.target.value);

  console.log(e.target.selectedOptions.length);

$.each( e.target.selectedOptions , function( index, obj ){
    console.log(obj.value);
});

});

Vous obtenez la longueur des sélections, donc peut être utile dans pour la boucle

console.log(e.target.selectedOptions.length);

et vous pouvez aussi parcourir les valeurs sélectionnées:

$.each( e.target.selectedOptions , function( index, obj ){
    console.log(obj.value);
});
3
Bilal Mustafa

Dans votre cas, vous devez prendre la valeur. J'utilise jQuery pour aider pour cela:

$('.selectpicker').change(function (e) {
    alert($(e.target).val());
});
1
Icepack

Voici comment obtenir la valeur de l'élément sélectionné dans la liste de sélection:

var e = document.getElementById("field_ID");  
var selected_value = e.options[e.selectedIndex].value;
0
Sheri Bgh