Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to get selected values in SumoSelect dropdown?

I am using the SumoSelect dropdown for multiselect options. But i cannot get the selected values array. Below the sample code :

<script type="text/javascript">
    $(document).ready(function () {         
    window.testSelAll = $('.testSelAll').SumoSelect({okCancelInMulti:true, selectAll:true });           

        $('.btnOk').on('click', function(){
            var obj = [];
            $('option:selected').each(function () {
                obj.push($(this).index());  
                alert("Selected Values=="+$(this).val());   
            });

            for (var i = 0; i < obj.length; i++) {                      
                $('.testSelAll')[0].sumo.unSelectItem(obj[i]);
            }
        });                 
    });

</script>

<select multiple="multiple" placeholder="Share Your Friends" onchange="console.log($(this).children(':selected').length)" class="testSelAll">
                <option value="1">Volvo</option>
               <option value="2">Saab</option>
               <option  value="3">Mercedes</option>
               <option value="audi">Audi</option>
               <option value="bmw">BMW</option>
               <option value="porsche">Porche</option>
               <option value="ferrari">Ferrari</option>
               <option value="mitsubishi">Mitsubishi</option>
       </select>
like image 609
Ramalingam Perumal Avatar asked Oct 22 '25 13:10

Ramalingam Perumal


2 Answers

If you want the selected values instead of the text, just change .text() to .val().

If you want to get the array, see below with working example at the bottom.

jQuery

$(document).ready(function() {
  $('.testSelAll').SumoSelect({
    okCancelInMulti: true,
    selectAll: true
  });

  $('.btnOk').on('click', function() {
    var obj = [],
        items = '';
    $('.testSelAll option:selected').each(function(i) {
      obj.push($(this).val());
      $('.testSelAll')[0].sumo.unSelectItem(i);
    });
    for (var i = 0; i < obj.length; i++) {
      items += ' ' + obj[i]
    };
    alert(items);
  });
});

HTML

<select multiple="multiple" class="testSelAll">
  <option value="car1">Volvo</option>
  <option value="car2">Saab</option>
  <option value="car3">Mercedes</option>
  <option value="car4">Audi</option>
</select>

Working JSFIDDLE

like image 186
Magnus Engdal Avatar answered Oct 24 '25 04:10

Magnus Engdal


You can get them from underlying hidden select element. using jquery eg.

$('.select1 option:selected')
like image 37
brandelizer Avatar answered Oct 24 '25 04:10

brandelizer



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!