Today what I've successfully done is I can change the color of default selected value in select box with jQueryMobile. Frankly, this feature is missing in jQueryMobile because nobody can obviously know whether any value is selected in select box or not. Because they missed out to let users know about it. That's why I need to add the customize function of myself.

First of all, we need to search the following coding in jquerymobile javascript.

view plain print about
1selectedIndex = select[0].selectedIndex == -1 ? 0 : select[0].selectedIndex,

Then, we need to add the following customize coding after that,

view plain print about
1className = select[0].selectedIndex == 0 ? "" : "ui-select-active",

(I've already showed the characteristic of above class name in my previous post. READ HERE.)

After adding above coding, we need to search the following coding. I think, it will be located after 7 lines of above coding.

view plain print about
1.text( $( select[0].options.item( selectedIndex ) ).text())

Once you found it, we need to add the following coding after that.

view plain print about
1.addClass( className )

After adding successfully, save it and rendering it. So, you can changed the default selected value in select box at jQueryMobile.

This entry was posted on May 23, 2011 at 1:23 AM and has received 2397 views. There are currently 0 comments. Print this entry.