Связывание действия обновления с кнопкой закрытия диалогового окна jquery

Question

Я бы хотел связать событие с кнопкой закрытия диалога jquery. Я сделаю все возможное, чтобы описать ситуацию: у меня есть своего рода повестка дня с 5 днями (с понедельника по пятницу), каждый день может иметь 20 строк. Когда вы щелкаете по значению указанного c дня, появляется диалоговое окно jquery, в котором содержится iFrame (ссылка на повестки дня. .aspx). Когда я закрываю диалог jQuery, мне нравится запускать событие btnUpdate, что означает, что будет обновлена ​​только строка с указанным c днем, а не вся страница. В этот момент я поместил кнопку btnUpdate на страницу, и она отлично работает .... но я надеюсь, что есть способ использовать кнопку закрытия диалогового окна jquery.

HTML code + jquery:
<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.ui/1.8.6/jquery-ui.min.js"></script>
<link type="text/css" rel="Stylesheet" href="http://ajax.microsoft.com/ajax/jquery.ui/1.8.6/themes/smoothness/jquery-ui.css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.ui/1.8.6/jquery-ui.min.js"></script>
<link type="text/css" rel="Stylesheet" href="http://ajax.microsoft.com/ajax/jquery.ui/1.8.6/themes/smoothness/jquery-ui.css"/>
<script type="text/javascript">
$(document).ready(function () {
$('a#pop').live('click', function (e) {
e.preventDefault();
var page = $(this).attr("href")
var pagetitle = $(this).attr("title")
var $dialog = $('<div></div>')
.html('<iframe style="border: 0px; " src="' + page + '" width="100%" height="100%"></iframe>')
.dialog({
autoOpen: false,
modal: true,
height: 800,
width: 1200,
title: pagetitle,
close: ReloadPage,
position: ["center", 20]
});
$dialog.dialog('open');
});
});
function ReloadPage() {
alert('test');
}
</script>

this is one of the updatepanels:
<asp:UpdatePanel ID="UpdatePanel2" runat="Server" UpdateMode="Conditional">
<ContentTemplate>
<tr>
<asp:Button ID="btnUpdate" UseSubmitBehavior="false" runat="server" onClick="btnUpdate_Click" Text ="Update" />
<asp:Label ID="labWeekOverzichtLestijd1_2" runat="server" Text=""></asp:Label>
<asp:Label ID="labWeekOverzichtLestijd2_2" runat="server" Text=""></asp:Label>
<asp:Label ID="labWeekOverzichtLestijd3_2" runat="server" Text=""></asp:Label>
<asp:Label ID="labWeekOverzichtLestijd4_2" runat="server" Text=""></asp:Label>
<asp:Label ID="labWeekOverzichtLestijd5_2" runat="server" Text=""></asp:Label>
</tr>
</ContentTemplate>
</asp:UpdatePanel>

I fill the agenda with a function in the codebehind:

For i = 1 To 20
fillLestijd (lestijd_index:=i, lestijden:=lestijden)
Next

Private Sub fillLestijd(ByVal lestijd_index As Integer, ByVal lestijden As Array) //here is also the link for activating the jquery dialog
labWeekOverzichtLestijd = "<td class='" + Session("dagkleur") + "'><span class='" + titelkleur + "'><a id='pop' href='agenda_lestijd.aspx?" & Session("weeknummer") & "&datum=" & datum & "&lestijd=" & var & "' title='Lestijden'><img src= 'graphics/edit1.png'></a>"
end sub

This is the code for the update of just one row:
Protected Sub btnUpdate_Click(sender As Object, e As EventArgs)
fillLestijd(lestijd_index:=aantal, lestijden:=lestijden)
Select Case aantal
Case 1
UpdatePanel1.Update()
Case 2
UpdatePanel2.Update()
Case 3
UpdatePanel3.Update()
Case 4
UpdatePanel4.Update()
Case 5
UpdatePanel5.Update()
Case 6
UpdatePanel6.Update()
Case 7
UpdatePanel7.Update()
Case 8
UpdatePanel8.Update()
Case 9
UpdatePanel9.Update()
Case 10
UpdatePanel10.Update()
Case 11
UpdatePanel11.Update()
Case 12
UpdatePanel12.Update()
Case 13
UpdatePanel13.Update()
Case 14
UpdatePanel14.Update()
Case 15
UpdatePanel15.Update()
Case 16
UpdatePanel16.Update()
Case 17
UpdatePanel17.Update()
Case 18
UpdatePanel18.Update()
Case 19
UpdatePanel19.Update()
Case 20
UpdatePanel20.Update()
End Select
End Sub

Can I get help for this topic?? Thxs

Answer 1

попробуйте это:

 $( ".selector" ).dialog({
      beforeClose: function( event, ui ) {
// do whatever you want before dialog closes
}
    });

для получения дополнительной информации, проверьте это

Надеюсь, это поможет.