Обновление списка с помощью мобильной версии jQuery 1.0rc3 - PullRequest
Новая
       14

Обновление списка с помощью мобильной версии jQuery 1.0rc3

2 голосов
/ 15 ноября 2011

Я разрабатываю приложение для планшета с версией jquery.mobile-1.0rc3 .Ранее я использовал версию jquery.mobile-1.0a4.1 в другом приложении, и было возможно обновить представление списка, выполнив myListview.listview ("refresh") .

У меня возникли некоторые проблемы, связанные с новой версией jquery.mobile-1.0rc3.Возможно ли это сделать с новой версией jquery.mobile-1.0rc3?

Большое спасибо.

Вот код: 

var lists = $( '#posicaoIntegradaActivosList, #posicaoIntegradaPassivosList, #posicaoIntegradaOutrosList' );

lists.empty();

/* Fill the lists with jquery template */

lists.listview( "refresh" );

Ошибка:

необработанное исключение: невозможно вызвать методы в просмотре списка до инициализации;попытался вызвать метод «refresh»

1 Ответ

3 голосов
/ 15 ноября 2011

В зависимости от того, когда ваш код выполняется, он может выполняться до процесса инициализации jQuery Mobile.jsFiddle по умолчанию запускает код после срабатывания события load, поэтому DOM полностью настроен, а jQuery Mobile выполнил инициализацию.Если вы измените jsFiddle @Phill Pafford (http://jsfiddle.net/qSmJq/3/) на «no wrap (body)» вместо «onLoad», то вы получите ту же ошибку, о которой вы сообщаете. Поэтому я рекомендую удалить строку lists.listview('refresh');помещение вашего кода в обработчик событий document.ready или pageshow/pagecreate: 

var lists = $( '#posicaoIntegradaActivosList, #posicaoIntegradaPassivosList, #posicaoIntegradaOutrosList' );

lists.empty();

/* Fill the lists with jquery template */

//lists.listview( "refresh" );

Вот jsfiddle для запуска кода, как только он анализируется браузером: http://jsfiddle.net/jasper/qSmJq/5/

Или: 

$(function () {
    var lists = $( '#posicaoIntegradaActivosList, #posicaoIntegradaPassivosList, #posicaoIntegradaOutrosList' );

    lists.empty();

    /* Fill the lists with jquery template */

    lists.listview( "refresh" );
}

Вот jsfiddle для упаковки вашего кода в document.ready обработчик событий: http://jsfiddle.net/jasper/qSmJq/4/

Или: 

$('#my-page-id').on('pagecreate', function () {
    var lists = $( '#posicaoIntegradaActivosList, #posicaoIntegradaPassivosList, #posicaoIntegradaOutrosList' );

    lists.empty();

    /* Fill the lists with jquery template */

    //lists.listview( "refresh" );
}

Здесьjsfiddle для использования события pageshow: http://jsfiddle.net/jasper/qSmJq/6/

А вот jsfiddle для использования события pagecreate: http://jsfiddle.net/jasper/qSmJq/7/

Примечание: если вы хотитечтобы определить, инициализировал ли jQuery Mobile определенный элемент, вы можете проверить наличие в нем определенных классов jQuery Mobile: 

$(function () {

    //cache lists
    var lists = $( '#posicaoIntegradaActivosList, #posicaoIntegradaPassivosList, #posicaoIntegradaOutrosList' );

    //iterate through the lists
    lists.each(function (index, value) {

        //cache this specific list
        var $value = $(value);

        /*add rows to this listview here*/

        //check if the listview has been initialized by jQuery Mobile by checking for the existence of the `ui-listview` class
        if ($value.hasClass('ui-listview')) {

            //since the class was found, refresh the already initialized element
            $value.listview('refresh');
        } else {

            //the class was not found, so initialize the widget
            $value.trigger('create');
        }
    });
});
...