When jBox is used in ASP. NETForm, When you click an event on the client registered by the button, you will find that the dialog box cannot be displayed. jBox is a good dialog box component.
When jBox is used in ASP. NET Form, the dialog box cannot be displayed when you click an event on the client registered by the button.
The result is that the page is submitted in a flash, causing the dialog box to flash and even fail to see it. The Mode dialog box fails.
First, buttons are processed by default. For common ASP. NET buttons, the form is submitted, and the page is refreshed when the form is submitted. Therefore, in order not to submit the form, you need to block the default button behavior, which can be achieved through the following code.
The Code is as follows:
Function stopDefault (e ){
// Prevent the default browser action (W3C)
If (e & e. preventDefault)
E. preventDefault ();
Else
// A closed cut for stoping the browser action in IE
Window. event. returnValue = false;
Return false;
}
Secondly, when closing the dialog box, we hope to be able to submit the form, which can also be achieved through scripts. Is to call the form object submission method submit ();
In implementation, we also need to find the Client ID of the control, which can be obtained as follows:
The Code is as follows:
Var btnSaveId = "<% = this. btnSave. ClientID %> ";
Var form1Id = "<% = this. form1.ClientID %> ";
The client for Button clicking is as follows:
The Code is as follows:
// Click Event Processing for the Registration button
$ ("#" + BtnSaveId). click (function (e ){
// Set to submit the form when closing the dialog.
Var options = {
Closed: function (){
Alert ("submit ");
// Find the form to be submitted
$ ("#" + Form1Id). submit ();
}
};
// Display the jBox dialog box
Var info = 'jquery jBox
Version: v2.0
Date: 2011-7-24
';
Info + = 'official Website: http://kudystudio.com/jbox </a> ';
$. JBox (info, options );
// Stop default event processing
StopDefault (e );
});
For jQuery, returning false in the event processing method can accomplish similar functions.
However, the two methods are different. Return false not only prevents the event from bubbling up, but also blocks the event itself.
StopDefault only blocks the default event and does not prevent event bubbles.
It can also prevent event bubbles, which requires the following method to be called.
The Code is as follows:
Function stopBubble (e ){
// If an event object is provided, then this is a non-IE browser
If (e & e. stopPropagation)
// And therefore it supports the W3C stopPropagation () method
E. stopPropagation ();
Else
// Otherwise, we need to use the Internet Explorer
// Way of canceling event bubbling
Window. event. cancelBubble = true;
}