Question

I have some jQuery functions which update some numbers when new values are selected in a <SELECT> field. The <SELECT> items are added dynamically by the user, so these functions use the .live() function. Everything goes as planned in Mozilla, Chrome, and IE8, but when I try to access the page on my iPad the numbers are no longer being updated accordingly. I have to click the <SELECT> field a second time for the numbers to update. Here is one of my functions:

    // Update subtotal when .months is changed
    $(".months").live('click',function(){

        var pid = this.id.replace("months", "");
        var price = document.getElementById('row' + pid).className;
        updateSubtotal(pid, price);

    });

All of the functions are contained within the document.ready() block. I’ve tried ‘click change’ and just ‘change’ as well, but they have issues in some other browsers.

Thanks for any and all help!

Answer 1

iPad and select elements don’t play very nice. You will need to bind to blur if you need the selected value to do anything.

Try something like this ( .months should be your select element ):

// Update subtotal when .months is changed
$(".months").on('blur', function(){

    var pid = this.id.replace("months", "");
    var price = document.getElementById('row' + pid).className;
    updateSubtotal(pid, price);

   });

EDIT
Try this:

// Update subtotal when .months is changed
$(document).on('blur|click', ".months", function(){
    var pid = this.id.replace("months", "");
    var price = document.getElementById('row' + pid).className;
    updateSubtotal(pid, price);
    });

The nice thing about on() is that you can attach it to an element and delegate from there. Since your $(document) will always be there it can also catch elements you add dynamically to the page and which are not there from the beginning. Since your original code used live I
expect the element to by loaded or generated dynamically. In that case in order to bind an event to it using on() you have to bind to the document and delegate to whatever .months is coming.