Проблема JQM (jQueryMobile) с просмотром списка содержимого AJAX («обновление») не работает - PullRequest
Новая
       16

Проблема JQM (jQueryMobile) с просмотром списка содержимого AJAX («обновление») не работает

4 голосов
/ 08 апреля 2011

Это издевательство над тем, что я делаю: 

function loadPage(pn) {
    $('#'+pn).live('pagecreate',function(event, ui){
        $('#'+pn+'-submit').click( function() {
            $.mobile.changePage({
                    url: 'page.php?parm=value', 
                    type: 'post', 
                    data: $('form#'+pn+'_form')
                },'slide',false,false);

            loadAjaxPages(pn);
        });
});

function loadAjaxPages(page) {
    // this returns the page I want, all is working
    $.ajax({
        url: 'page.php?parm=value',
        type: 'POST',
        error : function (){ document.title='error'; }, 
        success: function (data) {                  
            $('#display_'+page+'_page').html(data); // removed .page(), causing page to transition, but if I use .page() I can see the desired listview
        }
    });
}

в возвращаемом вызове ajax, если я добавлю .page () (который работал в прошлом, но у меня он был вне функции страницы, меняя логику того, как я загружаю страницы, чтобы сэкономить на времени загрузки), сделать переход страницы на следующую страницу, но я вижу, что представление списка оформлено так, как я хочу: 

$('#display_'+page+'_page').html(data).page();

Удаление .page () исправляет ошибку перехода, но теперь страница не стилизуется. Я пробовал listview('refresh') и даже listview('refresh',true), но не повезло.

Есть какие-нибудь мысли о том, как можно обновить представление списка?

Решение: 

$.ajax({
    url: 'page.php?parm=value',
    type: 'POST',
    error : function (){ document.title='error'; }, 
    success: function (data) {                  
        $('#display_'+page+'_page').html(data);
        $("div#name ul").listview(); // add div wrapper w/ name attr to use the refresh
    }
});

Ответы [ 2 ]

4 голосов
/ 11 апреля 2011
  1. Обязательно вызовите .listview для элемента ul
  2. Если раньше он не стилизовался, просто вызовите .listview(), загрузите функцию обновления.Если ваша настройка firebug верна, вы должны были увидеть сообщение об ошибке, сообщающее, что.

У меня не было времени, чтобы приступить к созданию некоторого кода, прежде чем вы опубликовали исправление, но вот немногорекомендация от меня: 

if(data !== null){ $('#display_'+page+'_page').html(data).find("ul").listview() }

Это немного лучше, чем новый глобальный селектор.Кроме того - вам не нужен div, и вы можете предоставить подробный селектор, если у вас несколько UL.

Внимание: для приведенного выше кода требуется data !== null.Если он нулевой - он выдаст ошибку.

0 голосов
/ 18 февраля 2012

Если вы добавляете элементы в просмотр списка, вам необходимо вызвать для него метод refresh (), чтобы обновить стили и создать любые вложенные списки, которые будут добавлены. Например:

$ ( '# MyList') ListView ( 'Обновить');.

Обратите внимание, что метод refresh () влияет только на новые узлы, добавленные в список. Это сделано из соображений производительности. Все элементы списка, которые уже были улучшены, будут игнорироваться процессом обновления. Это означает, что если вы измените содержимое или атрибуты уже расширенного элемента списка, они не будут отражены. Если вы хотите обновить элемент списка, замените его новой разметкой перед вызовом refresh.

подробнее здесь .

...