ASP.NET с всплывающим диалоговым окном jQuery: как отправить сообщение при закрытии диалога

Question

Люди,

Я работаю над довольно сложным сайтом. У нас есть панель обновления, которая содержит некоторые элементы управления. При щелчке по одному из элементов управления открывается диалоговое окно jQuery.

Когда диалоговое окно закрывается, я хочу дать сигнал панели обновления изменить ее отображение. Для этого мне нужно отправить обратно на панель обновления.

Я знаю, что в диалоговом окне есть удобное событие обратного вызова, к которому вы можете подключиться. Но вот в чем дело. Javascript, который управляет диалогом, находится в отдельном файле .js. Я хочу продолжать держать это отдельно. Поэтому код, выполняющий обратную передачу, должен быть либо в этом файле .js, либо внедрен в качестве параметра в некоторый метод в файле .js.

Как я могу это сделать? И что я передам методам файла .js?

Большое спасибо.

Answer 1

Только что пришлось решить это недавно.У меня есть общая функция, чтобы помочь с этой проблемой.

• Поместите скрытый asp:button в UpdatePanel или снаружи и установите его как AsyncPostBackTrigger.
• Вызовите функцию js из ItemDataBound, если необходимо, передавая вClientID скрытого asp:button.
• Функция js будет вызывать событие нажатия на кнопку, переданную после того, как будет нажата кнопка «ОК» или любое другое значение, установленное для buttonTxt.
• Затем вы можете обрабатывать UpdatePanel.Update автоматически, если кнопка находится внутри UpdatePanel или вызывать Update в пределах butHidden_Click.

Разметка:

<asp:UpdatePanel runat="server" ID="UpdatePanel1">
  <ContentTemplate>
     <asp:button id="btnHidden" style="display:none" runat="server" onclick="btnHidden_Click"/>
   </ContentTemplate>
 </asp:UpdatePanel> 

Сценарий:

   function showjQueryUIDialogOkBtnCallback(buttonToClick, dialogSelector, buttonTxt, isModal, width, height) 
   {
       var buttonOpts = {};
       buttonOpts[buttonTxt] = function () {
           $("#" + buttonToClick).trigger('click');
       };

       buttonOpts['Cancel'] = function () {
           $(this).dialog("close");
           $(this).dialog('destroy'); 
       }

       $(dialogSelector).dialog({
           resizable: false,
           height: height,
           width: width,
           modal: isModal,
           open: function (type, data) {
               $(this).parent().appendTo("form"); //won't postback unless within the form tag
           },
           buttons: buttonOpts

       });

       $(dialogSelector).dialog('open');

    }