javascript - Multiple Select bug in Firefox -
javascript - Multiple Select bug in Firefox -
i have specific problem multiple select values.
<form id="form-to-submit"> <select multiple="true" name="sel" id="sel"> <option id="0_1" value="0">bacon</option> <option value="1">pickles</option> <option id="0_3" value="2">mushrooms</option> <option value="3">cheese</option> </select> </form> <button id="setvalues">set values</button> js: $("#setvalues").click(function() { $("#sel").find("option").removeattr("selected"); $("#0_1").attr("selected","selected"); $("#0_3").attr("selected","selected"); });
i've crated jsfiddle shows problem:
when click on set values button, clears options selected attribute, sets selected first , 3rd options.
problem: in firefox after sec click on set values button, clears selection values. in other browsers works well.
any ideas?
instant solution!!!!
$("#0_1").prop("selected", true); $("#0_3").prop("selected", true);
some explanation ?!!?
so, what's difference between .attr() , .prop()!!!
basically, properties of dom elements whereas attributes html elements later parsed dom tree using browsers parser.
because of inconsistent behaviour amongst different browsers it's preferred utilize .prop() instead of .attr().
quoted jquery api documentation :
"to retrieve , alter dom properties such checked, selected, or disabled state of form elements, utilize .prop() method."
there lot's of reasons want switch .prop(). here's great thread helped me dive more of .attr() , .prop() ;)
.prop() vs .attr()
javascript jquery multiple-select
Comments
Post a Comment