We should control the Submit button when the form is submitted, and cannot click repeatedly to submit the data. Otherwise there will be redundant duplication of data in the system, causing the system to appear data garbage. jquery is simple enough to implement button control for form submission, here are the relevant examples and code.
[HTML]View PlainCopyPrint?
- < form action="${pagecontext.servletcontext.contextpath}/xxx/###" Method="POST" id="messageform">
- Name:<input name = "name" type ="text" />
- < Button type="button" id="Submit"> Submit an application </button>
- </ form >
- < Script >
- $ ("#submit"). Click (function () {
- $ (this). attr ("Disabled", "true"); Set the dimmed button
- $ ("#messageForm"). Submit ();//Submission Form
- SetTimeout ("$ (' #submit '). Removeattr (' disabled ')", 3000); Set three seconds after the submit button is displayed
- })
- </ SCRITP > </ span >
- </ span >
<form action= "${pagecontext.servletcontext.contextpath}/xxx/###" method= "post" id= "Messageform" > name: <input name = "Name" type= "text"/> <button type= "button" id= "submit" > Submit Request </button></form ><script>$ ("#submit"). Click (function () {$ (this). attr ("Disabled", "true");//Set the dimmed button $ ("#messageForm") Submit the form setTimeout ("$ (' #submit '). Removeattr (' disabled ')", 3000);//Set three seconds after the submit button display}) </scritp>< /span></span>
Attached: Other implementation methods, also used JS
The first type:
[HTML]View PlainCopyPrint?
- < form name= FM method="POST" action="/">
- < P > button to turn gray </ P >
- Name: <input type="text" Name="name"/>
- < input type="button" value="Commit" onclick = "Javascript:{this.disabled=true;document.fm.submit ();}" >
- </ form >
<form name=fm method= "POST" action= "/" ><p> button dimmed </p> name: <input type= "text" name= "name"/ > <input type= "button" value= "Submit" onclick= "Javascript:{this.disabled=true;document.fm.submit ();}" ></form>
The second type:
[HTML]View PlainCopyPrint?
- < form name = FM method = "POST" span class= "attribute" >action = "/" span class= "tag" >>
- < input type="Submit " name="Submit" value="Commit" id="Submitid" onclick="Submit ();" >
- </ form >
- < Script language="javascript">
- function Submit ()
- {
- var submitid=document. getElementById (' Submitid ');
- submitid.disabled = true ;
- Document.fm.submit ();
- SetTimeout ("submitid.disabled=false;", 3000);//code core here, 3 seconds to restore the button code
- }
- </ Script >
<form name=fm method= "POST" action= "/" >
Before and after the code control, the background code to be controlled, this way can ensure foolproof!
Background Code Control form submission There is a good way to use the session, specifically, you can refer to the following blog post:
Javaweb Learning Summary (13)--Use the session to prevent the form from repeating the submission http://www.cnblogs.com/xdp-gacl/p/3859416.html
In fact, the background control form repeated submission principle:
(1) Creating a unique token;token on the form submission page can be saved in the session. (It can also be saved in the cache if the cache is used)
(2) The submission of the time verification, the background first to verify token, verification through, before the submission of operations;
(3) When the form data is submitted successfully (save to database-persisted), then delete the corresponding token in the session (cache).
add tokens to the page to prevent unauthorized access-you can also do a duplicate submission of forms, using the principle of token!
http://blog.csdn.net/chinawszjr/article/details/51096095
Jquery implements form Submit button dimmed to prevent multiple clicks to submit duplicate data