How to trigger a client side event on closing ASP.NET Web Forms Dialog?
The Dialog triggers the ClientSideOnClose event when the Dialog control is closed programmatically or the “X” icon in the control is clicked to close the Dialog box window. That is, the event is triggered after closing the Dialog control. You can handle the client side functionalities by using the ClientSideOnClose event in the script side.
The following scenario updates the NumericTextBox value in the web page based on the value entered in the Dialog box by using the ClientSideOnClose event. Also a Button is displayed to reopen the dialog that is hidden on creation.
Refer to the following code example.
<%--Button, span and NumericTextBox updated after the dialog close event--%> <ej:Button ID="btnOpen" Type="Button" CssClass="e-btn" Text="Click to open dialog" ClientSideOnClick="btnclick" runat="server" ClientSideOnCreate="onButtonCreate"></ej:Button> <br /> <span id="label"></span> <br /> <ej:NumericTextBox runat="server" ID="NumValFromDialog"></ej:NumericTextBox> <ej:Dialog ID="Dialog1" Title="Sample" runat="server" ClientSideOnClose="UpdateData"> <DialogContent> <div> <br /> Your dialog contents here <br /> <ej:NumericTextBox runat="server" ID="num1"></ej:NumericTextBox> </div> </DialogContent> </ej:Dialog>
Define the Dialog close event in the client side script to perform the required action.
The following screenshots illustrate the output for the above scenario.
Figure 1: Click the close icon (X) with some value entered in the NumericTextBox
Figure 2: Close event is handled in client side script to update the value of NumericTextBox and a button to reopen the Dialog box
The Classic controls can be used in existing projects; however, if you are starting a new project, we recommend using the latest version of Essential Studio for ASP.NET. Although Syncfusion will continue to support all Classic Versions, we are happy to assist you in migrating to the newest edition.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls. If you have any queries or require clarifications, please let us know in the comments section below.