如何在纠正错误后让我的表单使用新信息？(How do I get my form to use new information after errors are corrected?)

我正在搜索，但我不是100％你如何重新提交这个，使用新的信息，我已经得到了所有的错误，并在适当的时候显示，但就如何再次点击提交按钮，然后它重新评估形式; 我该怎么办呢？任何帮助，将不胜感激。

HTML

<!doctype html> <html> <head> <meta charset="utf-8"> <title>RATool</title> <link rel="stylesheet" type="text/css" href="cfcss.css"> <script src="cf.js"></script> </head> <body> <h1> Health Authority </h1> <h2> Contact Form </h2> <form> <fieldset> <label for="fname">First Name:</label> <input name="fname" id="fname" class="formfield" type="text"> <span id="errfname" class="error">*This is required</span> <span id="errfname1" class="error">*Name fields must have more than one character, and do not contain numbers or other non-allowed alphabetic characters. The only character the last name field should legitimately contain is a hyphen (e.g. Whittaker-Jones).</span> <span id="errfname2" class="error">*This can only contain alphabetic numbers and if desired, one hyphen</span> <br> <label for="sname">Surname:</label> <input name="sname" id="sname" class="formfield" type="text"> <span id="errsname" class="error">*This is required</span> <span id="errsname1" class="error">*Name fields must have more than one character, and do not contain numbers or other non-allowed alphabetic characters. The only character the last name field should legitimately contain is a hyphen (e.g. Whittaker-Jones).</span> <span id="errsname2" class="error">*This can only contain alphabetic numbers and if desired, one hyphen</span> <br> <label for="title">Title: </label> <select name="title" id="title"> <option value="Please select">Please select</option> <option value="Mr.">Mr.</option> <option value="Ms.">Ms.</option> <option value="Mrs.">Mrs.</option> <option value="Miss.">Miss.</option> <option value="Master.">Master.</option> </select> <span id="errtitle" class="error">*This is required</span> <br> <br> <br> <label for="HANo">Health Authority Number:</label> <input name="HANo" id="HANo" class="formfield"type="text"> <span id="errHANo" class="error">*This is required</span> <span id="errHANo2" class="error">*This must be in format ZHA123456 (ZHA followed by 6 numbers)</span> <br> <br> <label for="email">Email:</label> <input name="email" id="email" class="formfield"type="text"> <span id="erremail" class="error">*This is required</span> <span id="erremail2" class="error">*Please enter a valid email</span> <br> <br> <br> <label for="telno">Telephone Number:</label> <input name="telno" id="telno" class="formfield" type="text"> <span id="errtelno" class="error">* If a telephone number is entered, then it should contain only numbers, not letters, or other disallowed characters. A valid Zedland telephone number has 11 digits (no spaces)</span> <span id="errtelno1" class="error">*This must just be numbers</span> <br> <button onclick="checkForm()">Submit</button> </fieldset> </form> </body> </html>

JavaScript的

I'm search but i'm not 100% how you get this to resubmit, using new information, I've got all the errors up and showing as appropriate, but in terms of, how to hit the submit button again, and then it reassesses the form; how do i go about this? Any help would be appreciated.

html

<!doctype html> <html> <head> <meta charset="utf-8"> <title>RATool</title> <link rel="stylesheet" type="text/css" href="cfcss.css"> <script src="cf.js"></script> </head> <body> <h1> Health Authority </h1> <h2> Contact Form </h2> <form> <fieldset> <label for="fname">First Name:</label> <input name="fname" id="fname" class="formfield" type="text"> <span id="errfname" class="error">*This is required</span> <span id="errfname1" class="error">*Name fields must have more than one character, and do not contain numbers or other non-allowed alphabetic characters. The only character the last name field should legitimately contain is a hyphen (e.g. Whittaker-Jones).</span> <span id="errfname2" class="error">*This can only contain alphabetic numbers and if desired, one hyphen</span> <br> <label for="sname">Surname:</label> <input name="sname" id="sname" class="formfield" type="text"> <span id="errsname" class="error">*This is required</span> <span id="errsname1" class="error">*Name fields must have more than one character, and do not contain numbers or other non-allowed alphabetic characters. The only character the last name field should legitimately contain is a hyphen (e.g. Whittaker-Jones).</span> <span id="errsname2" class="error">*This can only contain alphabetic numbers and if desired, one hyphen</span> <br> <label for="title">Title: </label> <select name="title" id="title"> <option value="Please select">Please select</option> <option value="Mr.">Mr.</option> <option value="Ms.">Ms.</option> <option value="Mrs.">Mrs.</option> <option value="Miss.">Miss.</option> <option value="Master.">Master.</option> </select> <span id="errtitle" class="error">*This is required</span> <br> <br> <br> <label for="HANo">Health Authority Number:</label> <input name="HANo" id="HANo" class="formfield"type="text"> <span id="errHANo" class="error">*This is required</span> <span id="errHANo2" class="error">*This must be in format ZHA123456 (ZHA followed by 6 numbers)</span> <br> <br> <label for="email">Email:</label> <input name="email" id="email" class="formfield"type="text"> <span id="erremail" class="error">*This is required</span> <span id="erremail2" class="error">*Please enter a valid email</span> <br> <br> <br> <label for="telno">Telephone Number:</label> <input name="telno" id="telno" class="formfield" type="text"> <span id="errtelno" class="error">* If a telephone number is entered, then it should contain only numbers, not letters, or other disallowed characters. A valid Zedland telephone number has 11 digits (no spaces)</span> <span id="errtelno1" class="error">*This must just be numbers</span> <br> <button onclick="checkForm()">Submit</button> </fieldset> </form> </body> </html>

javascript

最满意答案

默认情况下会显示您的错误消息。要隐藏那些，请在下面添加CSS类：

.error{ display:none; }

在checkForm()的开头添加这段代码，以便在纠正错误时重新隐藏消息。例如：

var errors=document.getElementsByClassName('error'); for(var i=0;i<errors.length;i++){ errors[i].style.display='none'; }

不要在按钮的onclick上调用formCheck()函数，而是在带有return的表单的提交上调用它。喜欢

要显示所有错误， var isValid=true;默认值为true的变量声明为true如var isValid=true; 就在for loop上方/下方Eg：

注意：如果出现false ，您还必须从checkEmail() ， checkHANo()等其他函数返回false 。看来你回来的只是true 。并删除所有e.preventDefault()

而已

Your error messages are displaying by default. To hide those add the CSS class below:

.error{ display:none; }

Add this piece of code at the beginning of checkForm() to re-hide the message when error is corrected. Eg:

var errors=document.getElementsByClassName('error'); for(var i=0;i<errors.length;i++){ errors[i].style.display='none'; }

Instead of calling the formCheck() function on onclick of the button, call it onsubmit of the form with a return. Like

To show all errors, declare a variable with default value as true like var isValid=true; just above/below the for loop Eg:

NOTE: You have to return false from other functions such as checkEmail(),checkHANo() also if there is error. It seems you are returning only true. And remove all e.preventDefault()

That's it

更多推荐