Диалоговое окно jQuery: Как сделать частичное обновление страницы и получить новые диалоговые окна каждый раз
У меня есть проблема рабочего процесса с моими диалоговыми окнами JQuery при попытке создать диалоговые окна и затем выполнении частичного рендеринга страницы. Я попытаюсь пройти демонстрационный сценарий и мои извинения заранее за долгое описание проблемы:
Загрузки страницы, с HTML, что я хотел бы быть превращенным в диалоговые окна JQuery. Диалоговые окна создаются на document.ready (использование .dialog()), но автооткрытое свойство имеет значение false. Когда JQuery создает диалоговые окна (если я использую Firebug для осмотра страницы), диалоговый HTML на самом деле разделен от его нормального местоположения и упорно продолжен самый конец документа с некоторыми классами обертки вокруг этого. Пользователь открывает диалоговые окна путем щелчка на ссылку, которая просто делает a $dialogDiv.dialog('open').
Так, чтобы все хорошо работало. Проблема состоит в том, что существуют времена, когда я делаю частичную перезагрузку страницы с помощью Ajax (использующий ASP.NET MVC RenderPartial). Часть страницы, которую я обновляю, оказывается, имеет весь диалоговый HTML в нем, так, чтобы был переписан. Но помните, что диалоговое окно (со всеми классами обертки JQuery, и т.д.) уже является там нижней частью документа. Тот HTML не был частью обновления страницы, поэтому теперь я застреваю с двумя наборами диалогового HTML. Это дает мне все виды проблем, потому что у меня есть дублирующийся идентификатор на странице, и поведение jQuery на этих элементах HTML становится непредсказуемым. Это еще хуже, когда я начинаю делать 3, 4, 5 частичных обновлений страницы, потому что затем я имею 3, 4, 5 наборов диалогового HTML (при этом только одно реальное диалоговое окно сделано на document.ready).
Я думаю, что, возможно, должен был бы уничтожить диалоговые окна или что-то в какой-то момент, но у меня не было удачи с этим подходом. У кого-либо есть какие-либо идеи?
Большое спасибо.
1 ответ
Я только что изменил Property = «Source» на Property = «Image.Source» и он работает. Спасибо всем
-121--3165661- Канал между двумя < input > создает космос между ними на странице. Необходимо удалить канал строки или использовать следующую хитрость:
<input id="NeedBtn" class="PostBtn" type="button" /><!--
--><input id="ProvBtn" class="PostBtn" type="button" />
Согласно документы , уничтожающие диалоговое окно, удаляют функциональные возможности диалогового окна и восстанавливают его в состояние перед инициализацией, но не удаляют его из DOM.
Поскольку вы заменяете содержимое и диалог, вы можете просто удалить старые.
$.ajax({
url: '/some/url/',
success:function(data){
$('.ui-dialog').empty().remove();
//add the new html and make the dialogs
}
});
В ответ на ваш комментарий
я не видел вашего кода, поэтому я не совсем уверен, как вы настраиваете диалоги, но в общем смысле я бы заполнил переменную только диалогами, которые будут заменены.
//inside document.ready
var myDialog=$('#myDialog').dialog(),
myOtherDialog=$('#myOtherDialog').dialog(),
permanentDialog=$('#permanentDialog').dialog(),
destroyableDialogs=[myDialog, myOtherDialog];
//ajax callback
success: function(data){
$.each(destroyableDialogs, function(i,n){
n.empty().remove();
});
}