Как восстановить диалог JQuery после уничтожения - PullRequest
6 голосов
/ 12 ноября 2009

Я создаю три модальных диалоговых окна при загрузке страницы (используя $(document).ready(function() {). Я создаю эти диалоги, вызывая метод setDialogWindows(), и передаю ему div для диалога. Код создания диалога ниже:

function setDialogWindows($element) {
 $element.dialog({
  autoOpen: false,
  modal: true,
  show: 'blind',
  hide: 'blind',
  width: 600,
  resizable: false,
  buttons: {
   Cancel: function() {
    $(this).dialog('destroy');
   },
   'Save': function() {
    $(this).dialog('close');
   }
  }
 });
}

Я избавлю вас от диалогового HTML, но есть некоторые функции перетаскивания jquery, которые я хочу полностью сбросить, когда пользователь нажимает Отмена. Отсюда $(this).dialog('destroy'). Однако, когда я снова щелкаю ссылку, чтобы открыть диалоговое окно, оно не отображается. Я понимаю, что это потому, что я не заново его инициировал, но я действительно не могу этого сделать, потому что диалоги создаются при загрузке страницы. Я попытался добавить рекурсивный своего рода вызов в функцию Cancel следующим образом:

   Cancel: function() {
    $(this).dialog('destroy');
    setDialogWindows($element);
   },

Но это не работает - все равно ничего не открывается, когда я нажимаю на ссылку, которая должна открыть его. Есть ли способ просто воссоздать диалоговое окно? Любые идеи о том, где я должен заново инициализировать диалог, если единственное место, где я делаю это сейчас, находится на document.ready?

Спасибо.

1 Ответ

4 голосов
/ 12 ноября 2009

Вы можете переместить setDialogWindows в обработчик кликов и установить для параметра autoOpen значение true, например:

$('path/to/clickable/elements').click(function(){
  setDialogWindows($element);
});

Это будет инициализировать диалоговое окно при каждом щелчке и уничтожать его при закрытии.

Вы также можете просто открыть отдельные диалоги, один с функцией перетаскивания, а другой без него.

...