jQuery Mobile Listview в диалоговом окне не будет инициализироваться

Я динамически создаю диалоговое окно, содержащее список, и добавляю его к body, когда пользователь переходит к определенному data-role=page. После добавления диалога к body я звоню

$('#myDialog').dialog();
$('#myList', '#myDialog').listview();

Когда я вызываю функцию listview(), я получаю следующую ошибку:

Uncaught TypeError: Cannot read property 'jQuery19105852627926506102' of undefined

Единственный способ, которым я смог инициализировать свой список, - это сделать это во время события pageshow диалогового окна, но тогда пользователь фактически видит элементы списка без стилей, пока функция listview() не будет завершена.

Есть ли способ инициализировать список внутри диалогового окна до того, как диалоговое окно будет показано?

Обновление: я получаю ту же ошибку, если использую `$('#myDialog').trigger('create').


person Brian    schedule 31.01.2014    source источник
comment
Является ли #myList внутри #myDialog HTML?   -  person MackieeE    schedule 01.02.2014
comment
$('#myDialog #myList').listview(); таким образом. В вашем коде вы вызываете .listview() как в диалоговом окне, так и в списке.   -  person Omar    schedule 01.02.2014
comment
@MackieeE - #myList внутри #myDialog.   -  person Brian    schedule 01.02.2014
comment
@Omar - $('#myList', '#myDialog') должен быть селектором для '#myList' в контексте (внутри) '#myDialog'   -  person Brian    schedule 01.02.2014
comment
@ Омар - я видел несколько других сообщений, на которые вы ответили на SO, и у меня есть вопрос ... Нельзя ли вызвать метод .listview() в представлении списка, которого нет на текущей активной странице? Я не видел этого нигде в документах jQuery Mobile.   -  person Brian    schedule 01.02.2014
comment
Поскольку вы создаете новое диалоговое окно динамически, вам не нужно вызывать какие-либо улучшения. просто добавьте его в тело и $.mobiel.changePage("#mydialog". { role: "dialog });.   -  person Omar    schedule 01.02.2014
comment
вот как создать диалог на лету. jsfiddle.net/Palestinian/F5r6v это на случай, если вы используете jQM 1.3.x   -  person Omar    schedule 01.02.2014


Ответы (1)


Диалоги обрабатываются так же, как и страницы. При динамическом добавлении страницы/диалога в DOM вам не нужно вызывать какие-либо улучшения, поскольку они инициализируются, как и все виджеты внутри, перед их отображением.

Все, что вам нужно, это добавить диалог к ​​<body> или $.mobile.pageContainer, а затем открыть диалог, используя $.mobile.changePage().

$.mobile.pageContainer.append("dialog HTML markup");
$.mobile.changePage("#dialog_ID");

Обратите внимание, что вызов методов улучшения для элементов на странице, которые еще не созданы/не инициализированы, приведет к ошибке. Однако вы можете обновить виджеты на посещенных/инициализированных страницах.

Демо

person Omar    schedule 31.01.2014