Цель:
- Пользователь нажимает кнопку отправить
- Открывается диалоговое окно jQuery-UI
- Диалог заполняется результатами серверного сценария (PHP)
Страница, запускающая диалог jQuery UI, называется advanced.php
.Диалог UI запущен и настроен на загрузку того же скрипта (advanced.php).После запуска диалогового окна я установил некоторые данные JSON и включил в эти данные флаг, который указывает advanced.php действовать по-другому.
// serialize the current form we want to pass into our script
var xData = $('#CONTROLLER').serialize();
// tack on a field that tells advanced.php to act differently
xData = xData + '&PLOTIT=1';
cURI = '/advanced.php';
$dialog = $('<div id="advanced-data"></div>').load(cURI, xData)
.dialog(
{ close : function(event, ui) { $(this).remove(); },
title : cTitle,
method : 'POST',
autoOpen : false,
width : 1024,
height : 400,
dataType : "json",
data : xData,
resizable : true,
modal : false,
show : 'blind',
hide : { effect: 'blind', duration: 300 },
dialogClass : 'Contact'
}
).data('parent', $parent);
$dialog.dialog('open');
Появляется диалоговое окно jQuery UI, и страница загружается.К сожалению, кажется, что логическое разделение между DOM, созданным advanced.php, не поддерживается.То есть, когда загружается диалог, все элементы формы, которые обычно скрыты, отображаются.Выдача:
$('.maincontent').hide();
(где maincontent
- это <div>
, охватывающий весь DOM) ничего не делает.Кажется, что JavaScript в документе, содержащемся в диалоге пользовательского интерфейса jQuery, также не работает.
Вместо того, чтобы переписывать скрипт, я надеюсь, что здесь есть что-то простое, что заставит скрипт в диалоге интерфейса пользователя jQueryработа.