it-swarm.com.ru

jquery-ui-dialog - как подключить событие закрытия диалога

Я использую плагин jquery-ui-dialog

Я ищу способ обновить страницу, когда в некоторых случаях, когда диалог закрыт.

Есть ли способ захватить закрытое событие из диалога?

Я знаю, что могу запускать код, когда нажимается кнопка закрытия, но это не касается закрытия пользователя с помощью escape или x в верхнем правом углу.

179
Brownie

Я нашел это!

Вы можете поймать событие закрытия, используя следующий код:

 $('div#popup_content').on('dialogclose', function(event) {
     alert('closed');
 });

Очевидно, я могу заменить предупреждение тем, что мне нужно сделать.
Edit: Начиная с Jquery 1.7, функция bind () включена ()

244
Brownie

Я полагаю, что вы также можете сделать это при создании диалога (скопировано из проекта, который я сделал):

dialog = $('#dialog').dialog({
    modal: true,
    autoOpen: false,
    width: 700,
    height: 500,
    minWidth: 700,
    minHeight: 500,
    position: ["center", 200],
    close: CloseFunction,
    overlay: {
        opacity: 0.5,
        background: "black"
    }
});

Примечание close: CloseFunction

182
Darryl Hein
$("#dialog").dialog({
autoOpen: false,
resizable: false,
width: 400,
height: 140,
modal: true, 
buttons: {
  "SUBMIT": function() { 
    $("form").submit();
  }, 
  "CANCEL": function() { 
    $(this).dialog("close");
  } 
},
**close: function() {
  alert('close');
}**
});
31
Mo Ming C
$( "#dialogueForm" ).dialog({
              autoOpen: false,
              height: "auto",
              width: "auto",
              modal: true,
                my: "center",
                at: "center",
                of: window,
              close : function(){
                  // functionality goes here
              }  
              });

Свойство close в диалоге дает событие закрытия для того же самого.

20
Taksh

Вы также можете попробовать это

$("#dialog").dialog({
            autoOpen: false,
            resizable: true,
            height: 400,
            width: 150,
            position: 'center',
            title: 'Term Sheet',
            beforeClose: function(event, ui) { 
               console.log('Event Fire');
            },
            modal: true,
            buttons: {
                "Submit": function () {
                    $(this).dialog("close");
                },
                "Cancel": function () {
                    $(this).dialog("close");
                }
            }
        });
14
Umair Noor

Это то, что сработало для меня ...

$('#dialog').live("dialogclose", function(){
   //code to run on dialog close
});
10
morttan

Начиная с jQuery 1.7, метод .on () является предпочтительным методом для прикрепления обработчиков событий к документу.

Поскольку никто не создал ответ с использованием .on() вместо bind(), я решил его создать.

$('div#dialog').on('dialogclose', function(event) {
     //custom logic fired after dialog is closed.  
});
8
Disper

добавить опцию "закрыть", как в примере и сделать то, что вы хотите встроенную функцию

close: function(e){
    //do something
}
6
Mehdi Roostaeian

Если я понимаю тип окна, о котором вы говорите, не $ (Окна) .unload () (для диалогового окна) дать вам нужный крюк?

(И если я неправильно понял, а вы говорите о диалоговом окне, созданном с помощью CSS, а не о всплывающем окне браузера, то все способы закрытия этого окна - это элементы, для которых вы можете зарегистрировать обработчики кликов.)

Правка: Ах, я вижу, теперь вы говорите о диалогах jquery-ui, которые сделаны с помощью CSS. Вы можете подключить Икс который закрывает окно, регистрируя обработчик щелчка для элемента с классом uI-диалог-Titlebar-близко,.

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

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

4
andy

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

$("#dialog").live('pagehide', function(event, ui) {
      $(this).hide();
});
2
Alexei