как обновить JQuery мобильные списки - PullRequest
Новая
       8

как обновить JQuery мобильные списки

2 голосов
/ 02 декабря 2011

Я пытаюсь обновить listview после того, как я изменяю элементы списка в нем, но он продолжает сбой с сообщением:

"Uncaught не может вызывать методы просмотра списка перед инициализацией; попытался вызвать метод "refresh" ".

Список - это неупорядоченный список в div с атрибутом data-role="dialog". В списке data-role="listview". После обновления, если я звоню $('#theULInQuestion').listview('refresh'), я получаю сообщение об ошибке. Что дает?

Спасибо, Rob

1 Ответ

4 голосов
/ 03 декабря 2011

В инфраструктуре jQuery Mobile существует множество событий страницы, из-за которых сложно определить, какой из них лучше связать. Я привязываюсь к событию pageshow, потому что к тому времени, когда оно запускается, DOM готов (jQuery Mobile все инициализировал).

Однако всякий раз, когда у меня возникают проблемы с синхронизацией refresh виджета jQuery Mobile, я проверяю, инициализирован ли он, и запускаю необходимый код для initialize или refresh виджета. 

$(document).delegate('#my-dialog-id', '<page-event>', function () {
    var $the_ul = $('#theULInQuestion');
    //add your rows to the listview here
    $the_ul.append('<li>a row</li><li>another row</li>');
    if ($the_ul.hasClass('ui-listview')) {
        $the_ul.listview('refresh');
    } else {
        $the_ul.trigger('create');
    }
});

Каждый из виджетов jQuery Mobile имеет определенные классы, которые добавляются к виджету этого типа. Таким образом, вы можете проверить (после добавления ваших строк), имеет ли виджет классы jQuery Mobile; если это так, то refresh это, если нет, то initialize это.

Вот jsfiddle: http://jsfiddle.net/jasper/urTeW/1/

Обратите внимание, что вы можете поместить условный оператор в refresh / initialize в любом месте вашего кода, это не должно происходить при срабатывании page-event.

...