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: 204
        
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