I am attempting to build a Selectmenu for my Jquery Mobile 1.3.1 app. I want to trigger a change event to update totals based on the items selected from the Selectmenu.
First I build the list of options that I re-use:
var options = "<option value='NR'>Not Reached</option> ";
options += "<option value='ALT'>Alternate</option> ";
Then I build a callback that will update the totals
var selects = new Array();
//callback to update the totals on change
var changeCallback = function(event, ui) {
var totals = new Object();
selects.forEach(function(select) {
value = select.value;
total = totals.value;
if(total) {
++total;
totals.value = total;
}
else {
totals.value = 1;
}
})
_updateTotals(totals);
};
Then I loop through to build the select boxes. Here's where I build the select box and add the callback:
var select = "<select name=" + selectName + " id=" + selectName + "> ";
select += options;
select += "</select>";
select.on( "change", changeCallback);
select = jQuery.parseHTML(select)[0];
selects.push(select);
Problem is that when the bind gets executed, it jumps from the loop to the return, which I'm assuming indicates an error.