CODEWITHSUNDEEP
jquerybootstrap-selectpicker
Gagantous
Gagantous

Reputation: 518

Reset the bootstrap-select using jQuery iniside a form

For example i have option with selectpicker implemented.

<form class="form-horizontal" id="myFormskpd" >
<select class="selectpicker form-control" id="id_objek_penugasan_skpd" name="id_objek_penugasan_skpd" data-live-search="true"  title="Pilih data objek penugasan" >
<option data-subtext="01" value="1" >SKPD Provinsi Maluku </option>
<option data-subtext="02" value="2" > SKPD Kabupaten/Kota Maluku </option>
<option data-subtext="03" value="3" >Satuan Kerja Pusat </option>
<option data-subtext="04" value="4" >Proyek Pusat  </option>
<option data-subtext="05" value="5" >Proyek Daerah  </option>
<option data-subtext="06" value="6" >BUMN  </option>
<option data-subtext="07" value="7" >BUMD  </option>
</select>
</form>

When i have selected the option, i couldnt make the option set to blank again ( set to null )

I used reset to make the my myFormskpd clear.

$('#myFormskpd')[0].reset();

But it didn't work for me. I have tried:

$('#id_objek_penugasan_skpd').selectpicker('deselectAll');

It's only deselect one select picker. Are there a way to reset the form so it make all the selectpicker clear ? for example, i have a form. Inside this form, i have five different selectpicker. Usually, i used $('#myFormskpd')[0].reset(); to clear the form in one go. But it didn't work in selectpicker it still show the previous selected option.

Upvotes: 0

Views: 5502

Answers (1)

tonoslfx
tonoslfx

Reputation: 3442

Try the following code:

https://codepen.io/zerolfc/full/pWYwNq/

$(function() {

    $('.selectpicker').selectpicker();

    $('button').click(function() {

        $('#id_objek_penugasan_skpd').selectpicker('deselectAll');

        // or $('.selectpicker').selectpicker('deselectAll');

    });


});

Upvotes: 1

Related Questions