javascript - Select2 multi-select with no closeOnSelect overlaps results on top of selected tags -


problem:

when have select2() closeonselect =false, results list overlaps selected values when no of selected values cause values wrap around.

html:

<select multiple id="e1" style="width:300px">   <option value="al">alabama</option>   <option value="ak">alaska</option>   <option value="az">arizona</option>   <option value="ar">arkansas</option>... </select> 

javascript:

$("#e1").select2({   closeonselect: false }) 

screenshot:

enter image description here

fiddle:

http://jsfiddle.net/sajjansarkar/dsg2t7y2/

while not cleaner sajjan's answer. call close , open in change event of select. causes box redrawn on every selection without need of knowing class names select2 happens using version (in case changes).

var select = $("#e1").select2({   closeonselect: false }).on("change", function(e){   select.select2("close");   select.select2("open"); }); 

http://jsfiddle.net/dsg2t7y2/1/

this has advantage of using same methods select2 use position dropdown. if have on page close on select, consistent.

sidenote: annoying is, both , without scroller returns top after every selection. shudders kinda kills me inside


Comments

Popular posts from this blog

node.js - Node js - Trying to send POST request, but it is not loading javascript content -

javascript - Replicate keyboard event with html button -

javascript - Web audio api 5.1 surround example not working in firefox -