jquery - Chosen Multiselect dropdownlist loading issue -
i using ‘choosen-select’ multiselect dropdown list.
i facing problem dropdown list, while page loading list displayed in enlarge form(all items visible , no effect of chosen library)for moment , regain desired feel , shape of dropdown list.
please find attached image of before , after page load. attachment
have wrapped script in $(document).ready()
function?
this should ensure none of scripts run until page has been loaded.
its possible .chosen()
running before page has loaded initial elements first.
more info here
$(document).ready(function() { //following code used generate 2000 items in select element //in order try , replicate issue. var counter = 2000; for( var i=1; <= counter; i++ ) { $(".chosen-select").append("<option> item " + + "</option>"); } //initialise jquery chosen library on select element $(".chosen-select").chosen(); });
<!-- links external resources , jquery 2.1.1 !--> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/chosen/1.1.0/chosen.jquery.min.js"></script> <link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/chosen/1.1.0/chosen.min.css"> <!-- html !--> <select multiple class="chosen-select"></select>
also, make sure referencing jquery library before reference chosen library in markup.
wiki
Comments
Post a Comment