I have a type of hierarchical select for regions.
The first select box gets displayed. Let's call it "continents" and define it as:
- <select name="continents" id="continents">
- <option value="1">Africa</option>
- <option value="2">North America</option>
- ...
- </select>
The second select box (which is dependent on which continent you select) contains a list of countries and is generated by a PHP page server-side and accessed via an Ajax call.
The functionality I have implemented works fine. The select boxes are populated correctly. However, the jquery mobile styles are not implemented on the selects obtained via ajax.
What I have tried:
- Including the jquery/jquerymobile js & css files in the page that generates the select box
--- This results in the entire page freaking out. It creates strange containers around existing elements on the page (kind of double-wrapping/duplicating it) and the new select box looks fine
- Using the .page() function as described in other forum posts
--- Nothing happens
- Using the .customSelect() function as described in other forum posts
--- Error with "object does not support this function"
I'm sure I'm just doing something completely wrong. Can anyone help?
For reference, here is the COMPLETE php file that gets the list of provinces in a country (ajax return):
- <label for='province' class='select'>Choose Province:</label>
- <?php
- $sql = mysql_query("SELECT * FROM TblRegion WHERE ParentRegionId = ".$_GET["country"]);
- $oDBConn = new DBConn;
- echo '<select id="province" name="province"">
- <option value="0">Select Province</option>';
- while($row = mysql_fetch_array($sql)){
- echo '<option value='.$row['PkIdxRegionId'].'>'.$row['RegionName'].'</option>';
- }?>
- </select>
Edit:
I have now also tried this solution as suggested by the newest documentation:
- var myselect = $("select#foo");
- myselect[0].selectedIndex = 3;
- myselect.selectmenu("refresh");
This results in the following error message:
- Uncaught cannot call methods on selectmenu prior to initialization; attempted to call method 'refresh'