onsubmit is failing to javascript function
Question
In below code, there is a form to create login for new user. And on the press of continue button it should call 'validateForm()' function. Where it is checking the values filled in form and on missing of proper value(s) it should give the alert message. But, is not giving any alert even on error, like I am pressing 'continue' even the form is completely empty.
<html>
<head>
<title></title>
<script type="text/javascript">
function validateForm()
{
var email=document.forms["newlogin"]["email"].value;
var cemail=document.forms["newlogin"]["cemail"].value;
var pass=document.forms["newlogin"]["pwd"].value;
var cpass=document.forms["newlogin"]["cpwd"].value;
var answ1=document.forms["newlogin"]["ans1"].value;
var answ2=document.forms["newlogin"]["ans2].value;
alert("I am IN");
if(email==null || email=="" || cemail==null || cemail=="") {
alert("Enter Email ID and confirm.");
return false;
}
if(pass==null || pass=="" || cpass==null || cemail=="") {
alert("Enter Password and confirm.");
return false;
}
if(answ1==null || answ1=="" || answ2=null || answ2=="") {
alert("Enter Answer 1 & Answer 2.");
return false;
}
if(email!=cemail) {
alert("Confirmed Email ID is not matching.");
return false;
}
if(pass!=cpass) {
alert("Confirmed Password is not matching.");
return false;
}
}
</script>
</head>
<body>
<h1 style="font:swis721 bt">enginenc</h1>
<form name="newlogin" method="POST" action="http://localhost/cgi-bin/createlogin" onsubmit="return validateForm()">
<table align="center" cellpadding="10" cellspacing="0" style="margin-top:2cm;background-color:#FFD700;border-top:1px solid;border-bottom:1px solid;border-left:1px dotted;border-right:1px dotted" border=0>
<tr>
<td align="left" style="font:westwood let">Enter a valid Email ID:</td>
<td align="left" style="font:westwood let"><input type="text" name="email"></td>
</tr>
<tr>
<td align="left" style="font:westwood let">Confirm the Email ID:</td>
<td align="left" style="font:westwood let"><input type="text" name="cemail"></td>
</tr>
<tr>
<td align="left" style="font:westwood let">Enter password:</td>
<td align="left" style="font:westwood let"><input type="password" name="pwd"></td>
</tr>
<tr>
<td align="left" style="font:westwood let">Confirm Passowrd:</td>
<td align="left" style="font:westwood let"><input type="password" name="cpwd"></td>
</tr>
<tr>
<td align="left" style="font:westwood let">Select Question 1:</td>
<td align="left" style="font:westwood let"><select name="ques1"><option value=1>1. What is your mother's maiden name?</option><option value=2>2. Which is your birth city?</option><option value=3>3. Which is your favorite place?</option></select></td>
</tr>
<tr>
<td align="left" style="font:westwood let">Answer 1:</td>
<td align="left" style="font:westwood let"><input type="text" name="ans1"></td>
</tr>
<tr>
<td align="left" style="font:westwood let">Select Question 2:</td>
<td align="left" style="font:westwood let"><select name="ques2"><option value=1>1. Which is your dream car?</option><option value=2>2. What is your nick name?</option><option value=3>3. Who is your favorite singer?</option></select></td>
</tr>
<tr>
<td align="left" style="font:westwood let">Answer 2:</td>
<td align="left" style="font:westwood let"><input type="text" name="ans2"></td>
</tr>
<tr>
<td align="left" style="font:westwood let"><input style="margin-left:3cm;padding:11px" type="submit" value="Continue"></td>
<td align="left" style="font:westwood let"><input style="padding:11px" type="reset"></td>
</tr>
</table>
</form>
</body>
</html>
Here, on submit of the form using onsubmit()="return validateForm()" function. Form is not calling the function validateForm() . I tried alot but did not find the error. Please help. Thanks.
4 answers
solution1
0 2013-01-28 09:55:36
You have typos:
var answ2=document.forms["newlogin"]["ans2].value; - missing "
if(answ1==null || answ1=="" || answ2=null || answ2=="") - missing ==
Then it should work.
solution2
0 ACCPTED 2013-01-28 09:55:42
change
var answ2=document.forms["newlogin"]["ans2].value;
to
var answ2=document.forms["newlogin"]["ans2"].value; //missing quote
And
if(answ1==null || answ1=="" || answ2=null || answ2=="") {
to
if(answ1==null || answ1=="" || answ2==null || answ2=="") {
solution3
0 2013-01-28 09:58:55
There are some syntax errors.
Check this line. " is missing in that line. Change the line From,
var answ2=document.forms["newlogin"]["ans2].value;
To,
var answ2=document.forms["newlogin"]["ans2"].value;
And, You have to use == to check the condition in if statement. But in the below line, you have used only one = . Change the line from,
if(answ1==null || answ1=="" || answ2=null || answ2=="") {
alert("Enter Answer 1 & Answer 2.");
return false;
}
To,
if(answ1==null || answ1=="" || answ2==null || answ2=="") {
alert("Enter Answer 1 & Answer 2.");
return false;
}
Suggestion: Use firebug or javascript error console to figure out these errors.
solution4
0 2013-01-28 09:59:52
尝试添加到调用函数单词“ this ”中： <form name="newlogin" method="POST" action="http://localhost/cgi-bin/createlogin" onsubmit="return validateForm(this)">
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.