"ASP." Prevents repeated clicks of the submit button causing the page to be repeatedly submitted "

Source: Internet
Author: User

Recent projects have encountered such a situation:

The company's network is slower than usual, after the click on the Save button to submit the page to wait for a long time, could not help hands a few more points, when the completion of the submission of the database statement execution exception.

Two kinds of authentication methods:

The 1th type:

ASPX page button:

<asp:Button ID="btnSumbit" runat="server" Text="提交" onclick="btnSumbit_Click" />

Page_Load event:

    1. BTNSUMBIT.ATTRIBUTES.ADD ("onclick", "this.disabled=true;" + This. Clientscript.getpostbackeventreference (Btnsumbit, ""));
    2. //If ASP is used. NET validation control to ensure the execution of the client validation function page_clientvalidate (), the code is as follows
    3. The //page_clientvalidate () function is used in the ASPX page containing the Microsoft validation control (client JS script), which returns TRUE or false depending on whether the user input operation is valid
    4. BTNSUMBIT.ATTRIBUTES.ADD ("onclick", "if" (typeof (page_clientvalidate) = = ' function ') {if (page_clientvalidate () = = False) {return false;}}; this.disabled=true; "+ This. Clientscript.getpostbackeventreference (Btnsumbit, ""));

The client HTML code corresponding to the Submit button Btnsumbit is as follows:

  1. <input type="Submit" name= "btnsumbit" value="Submit" onclick="this.disabled =true;__dopostback (' btnsumbit ', '); "/>
  2. Or
  3. <input type="Submit" name= "btnsumbit" value="Submit" onclick="if (typeof ( page_clientvalidate) = = ' function ') {if (page_clientvalidate () = = False) {return false;}}; This.disabled=true;__dopostback (' btnsumbit ', '); "/>

Analytical:

This. The function of Clientscript.getpostbackeventreference (Btnsumbit, "") is to generate a call on the client page JS method __doPostBack (Eventtarget, eventargument) The script, submit the form

The client JS method __doPostBack (Eventtarget, eventargument) (generated automatically when the ASP. NET page is render) is as follows (in-depth understanding of __doPostBack):

  1. <input type="hidden" name="__eventtarget" id= "__eventtarget" value= ""/ >
  2. <input type="hidden" name="__eventargument" id= "__eventargument" value=""/>
  3. <script type="Text/javascript" >
  4. //<! [Cdata[
  5. var theform = document.forms[' Form1 '];
  6. if (!theform) {
  7. Theform = Document.form1;
  8. }
  9. function __dopostback (eventtarget, eventargument) {
  10. if (!theform.onsubmit | | (Theform.onsubmit ()! = false)) {
  11. Theform.__eventtarget.value = Eventtarget;
  12. Theform.__eventargument.value = eventargument;
  13. Theform.submit ();
  14. }
  15. }
  16. //]] >
  17. </script>

The 2nd type:

ASPX page button:

  1. <asp:button id="btnsumbit" runat="server" text="commit" usesubmitbehavior="false" onclientclick= "This.value= ' is being submitted '; this.disabled=true;" Onclick="Btnsumbit_click"/>
  2. //If ASP is used. NET validation control to ensure the execution of the client validation function page_clientvalidate (), the code is as follows
  3. The //page_clientvalidate () function is used in the ASPX page containing the Microsoft validation control (client JS script), which returns TRUE or false depending on whether the user input operation is valid
  4. <asp:button id="btnsumbit" runat="server" text="commit" usesubmitbehavior="false" onclientclick= "If (typeof (page_clientvalidate) = = ' function ') {if (page_clientvalidate () = = False) {return false;}}; This.value= ' being submitted '; this.disabled=true; "Onclick=" Btnsumbit_click "/>

No code to add to the button in the background

The client HTML code corresponding to the Submit button Btnsumbit is as follows:

  1. <span style="Font-size:14px;color: #3366ff;" ><input type="button" name="btnsumbit" value="Submit" onclick=" This.value= ' is being submitted '; This.disabled=true;__dopostback (' btnsumbit ', ');/>
  2. Or
  3. <input type="button" name="btnsumbit" value="Submit" onclick="if (typeof ( page_clientvalidate) = = ' function ') {if (page_clientvalidate () = = False) {return false;}}; This.value= ' being submitted '; This.disabled=true;__dopostback (' btnsumbit ', ');/></span>

Compared with the method ①, the Submit button is almost identical to the HTML code generated by the client, although the type is different, but all are submitted using the Client method __doPostBack (' Btnsumbit ', ')

Usersubmitbehavior = True Button control and (<asp:Button/> and <asp:ImageButton/>) using the browser's submit function, default value

Usersubmitbehavior = False Button control (IBID.) of the postback commit mechanism for ASP. ASP. NET adds a client script to pass the form back and forth, i.e. __dopostback (eventtarget, Ev Entargument) method

(Note: All postback controls except <asp:Button/> and <asp:ImageButton/> for all of the ASP. NET server controls are PostBack submitted by the __doPostBack method to trigger the page)

=========================================================================================

In addition to the above two methods, you have also developed a simple method, you can also prevent multiple clicks to repeat the submission:

Define a JS global variable var isclick=false whether it has been clicked Commit, true: clicked Submit; false: not clicked

  1. <asp:button id="btnsumbit" runat="server" text="commit" onclientclick="if (isclick==false) {isclick= True return true;} else {return false;} "onclick=" Btnsumbit_click "/>
  2. //If ASP is used. NET validation control to ensure the execution of the client validation function page_clientvalidate (), the code is as follows
  3. The //page_clientvalidate () function is used in the ASPX page containing the Microsoft validation control (client JS script), which returns TRUE or false depending on whether the user input operation is valid
  4. <asp:button id="btnsumbit" runat="server" text="submit" onclientclick="if (typeof (Page_ clientvalidate) = = ' function ') {if (page_clientvalidate () = = False) {return false;}}; if (isclick==false) {isclick=true; return true;} else {return false;} "onclick=" Btnsumbit_click "/>

(Note: If the page says UpdatePanel and <asp:Button/> is included in UpdatePanel, after the asynchronous postback (after a partial refresh of the page), the value of Isclick must be reset to false, as in the following ways:

$ (document). Ready (function () {
EndRequest event: Raised after the asynchronous postback is complete and control is returned to the browser
Sys.WebForms.PageRequestManager.getInstance (). Add_endrequest (Endrequesthandler);
});
UpdatePanel asynchronous postback local flush post-processing function
function Endrequesthandler (sender, args) {
Isclick = false;
}

"ASP." Prevents repeated clicks of the submit button causing the page to be repeatedly submitted "

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.