Clever Geek Handbook

JQuery mobile does not display the correct selected item in the list

I have a selection list. I am using jQuery to update the selected element. The displayed item in the box does not change when the selected value changes. In the following example, option "a" is set as selected. Then I use jQuery to change the selected element to "d". It still shows "a". However, if you expand the list, you will see that "d" is selected or highlighted. Do not know how to solve the problem. Any help would be appreciated!

http://jsfiddle.net/9wQcs/5/

Html:

<select id="t">
  <option>select one</option>
  <option id="a" selected="selected">a</option>
  <option id="b">b</option>
  <option id="c">c</option>
  <option id="d">d</option>
</select>

JQuery

$(document).ready(function () {
$('#d').prop('selected', 'selected');
});

Thanks Brian

0


source to share


1 answer


First of all, refrain from using .ready()

jQuery Mobile.

When you select an option programmatically, you need to select the Favorite Selection widget.



$("#id").prop("selected", true);
$("select_id").selectmenu("refresh");

Demo

+1


source






More articles:


All Articles