### jQuery Mobile Select Menu

Various hints related to the jQuery Mobile (jQM) Select Menu.
The SelectMenu used has the ID "selectevent"
Clear all Entries from the Select Menu
ws.Eval("$('#selectevent').empty();", Null)
Remove all Option Elements from the Select Menu
ws.Eval("$('selectevent option').remove();", Null)
As a JS Function
function removeOption(){
$('#selectevent option:selected').remove();
$('#selectevent').selectmenu('refresh', true);
}
Select first Entry from the Select Menu
To select the first entry of the menu, ensure to deselect entries first, then select first entry followed by a change trigger to update the UI!
ws.Eval("$('#selectevent').removeAttr('selected').find('option:first').attr('selected', 'selected');", Null)
ws.Eval("$('#selectevent').val($('#selectevent option:first').val()).change();", Null)
Add a Placeholder to the Select Menu which shows the text "Choose an Event"
ws.Eval("$('').attr({'value':'" & "-1" & "'}).html('" & "Choose an Event" & "').appendTo('#selectevent');", Null)
Populate the Select Menu with Entries from a SQLite Table
Example uses Table Events with fields ID (as the Select Value) and Event (as the selectiontext displayed)
cur = SQL1.ExecQuery("SELECT * FROM Events")
Do While cur.NextRow
ws.Eval("$('').attr({'value':'" & cur.GetString("ID") & "'}).html('" & cur.GetString("Event") & "').appendTo('#selectevent');", Null)
Loop
cur.Close
Handle Selection Change in the index.html file
Add to the script section:
$("#selectevent").change(function(event, ui) {
var selected = this.value;
console.log('Selected = ' + selected);
b4j_raiseEvent("selectevent_event", {"result": selected});
});

Changed: , Category: WebApps jQuery Mobile, File: T6C282M2112.htm, ID: 2112