jquery - I need to add "Add new item" option in Select2 -
i want add button in first element of list "add new item". if user click on button need open pop-up , input users. how in select2 plugin. default options (or) need customize this?
basically kld suggested, without additional buttons understand op wants use first option of select
trigger new value modal. checks value when select2:close event triggered , if "new"
selected, prompts new value, adds @ end of select
box , selects it.
note: i've disabled search in input , added placeholder
$(function () { $(".select2") .select2({ placeholder: 'select type', width: '50%', minimumresultsforsearch: infinity }) .on('select2:close', function() { var el = $(this); if(el.val()==="new") { var newval = prompt("enter new value: "); if(newval !== null) { el.append('<option>'+newval+'</option>') .val(newval); } } }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script> <select id="mysel" class="select2"> <option></option> <option value="new">add new type</option> <option>car</option> <option>bus</option> <option>two</option> <option>three</option> </select>
Comments
Post a Comment