Adding dynamic content with events in jquerymobile

Posted by Christian Waidner on Stack Overflow See other posts from Stack Overflow or by Christian Waidner
Published on 2014-05-24T18:46:23Z Indexed on 2014/05/26 21:26 UTC
Read the original article Hit count: 166

Filed under:
|
|

Currently I'm stuck with a problem in jquerymobile: I'm adding items to a list dynamically and use enhanceWithin() in the end (so styling is correct). After this I like to add click-events for each list item but the problem is, that enhanceWithin runs asynchronous and so I always get the error message "cannot call methods on checkboxradio prior to initialization; attempted to call method 'refresh'"

When I delay the event-adding-code it works perfectly.

Does anyone have an idea if there is a enhanceWithin.done event or anything else I can use?

HTML:

...
<div id="shoppinglist">Loading list...</div>
...

Javascript:

function updateList()
{
    var result = "";

    $.each(shoppinglistItems, function (index, item) {
        result += '<label><input type="checkbox" ' + item.checked + ' id="item_' + item.id + '">' + item.name + '</label>\n';
    });

    $('#shoppinglist').html(result).enhanceWithin();

    // Change-Events an die Checkboxen knoten
    $('input[id*=item_]').unbind('change').bind('change', function (event) {
        var itemid = $(this).attr('id');
        itemid = (itemid.split('_'))[1];    // Nur die Zahl extrahieren
        // Passendes Item aus der Liste der Items suchen und checken
        $.each(shoppinglistItems, function (index, item) {
            if (item.id == itemid)
            {
                item.checked = "checked";
                item.timestamp = moment().format("YYYYMMDDHHmmss");
            }
        });
        updateList();
    });
}

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about jQuery