Binding change event to a select

492 views Asked by At

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.

0

There are 0 answers