Bootstrap Select Picker append add new item if search not exist

 <select class="selectpicker" data-live-search="true" id="branch" multiple>

        <option>B.Tech</option>
        <option>M.Tech</option>
        <option>Ph.D</option>
</select>

jQuery script


$('.selectpicker').selectpicker({
noneResultsText: 'No result found <button class="btn btn-dark" onclick=(add_opt(this))>Add new option</button>'
}); 

function add_opt(event){
var value = $(event).parents('div').siblings('.bs-searchbox').find('input').val();
$(event).parents('div').siblings('.selectpicker').append($("<option></option>").text(value)).val(value);
$('.selectpicker').selectpicker('refresh');
}

Comments

Popular Posts

How to pass hash in Postman

nginx: unrecognized service

Reading Excel Sheets using "Roo" gem in ruby on rails

Add CORS to Nginx on AWS Elastic Beanstalk

Enable gzip compression on Elastic Beanstalk with nginx

Can't connect to local MySQL server through socket '/var/run/mysqld/mysqld.sock'

Get video duration by URL in Ruby on Rails

site-enables nginx setting in ruby in rails