admin管理员组

文章数量:1202361

I was doing the testing for the first time. I read the this code and made one of my own from it. The thing is that its not giving any error even if the fields are left empty.

Here is my fiddle.

Please help out. Thanks.

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
{function validateForm()

var x=document.forms["myForm"]["name"].value;
if (x==null || x=="")
  {
  alert("Name must be filled out");
  return false;
  }

var y=document.forms["myForm"]["password"].value;
  {
if (y==null || y=="")
  alert("Password name must be filled out");
  return false;
  }
</script>
</head>

<body>

<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
Name*: <input type="text" name="name"> <br>
Password*: <input type="password" name="password"><br>
Email: <input type="text" name="email"><br>
<input type="submit" value="Submit">
</form>
</body>

</html>

I was doing the testing for the first time. I read the this code and made one of my own from it. The thing is that its not giving any error even if the fields are left empty.

Here is my fiddle.

Please help out. Thanks.

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
{function validateForm()

var x=document.forms["myForm"]["name"].value;
if (x==null || x=="")
  {
  alert("Name must be filled out");
  return false;
  }

var y=document.forms["myForm"]["password"].value;
  {
if (y==null || y=="")
  alert("Password name must be filled out");
  return false;
  }
</script>
</head>

<body>

<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
Name*: <input type="text" name="name"> <br>
Password*: <input type="password" name="password"><br>
Email: <input type="text" name="email"><br>
<input type="submit" value="Submit">
</form>
</body>

</html>

Share Improve this question asked Jun 1, 2012 at 20:24 user379888user379888
Add a comment  | 

5 Answers 5

Reset to default 8

Fixed code: jsfiddle

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function validateForm() {

var x=document.forms["myForm"]["name"].value;
if (x==null || x=="")
 {
  alert("Name must be filled out");
  return false;
 }

var y=document.forms["myForm"]["password"].value;
if (y==null || y=="") {
  alert("Password name must be filled out");
  return false;
}
}
</script>
</head>

<body>

<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
Name*: <input type="text" name="name"> <br>
Password*: <input type="password" name="password"><br>
Email: <input type="text" name="email"><br>
<input type="submit" value="Submit">
</form>
</body>
<html>

Be careful of where you place your braces. Additionally, it is advantageous to use the console on your browser to identify some errors and fixed them.

Your brace should be after function validateForm() and after the if, and at the end of the function. Overall, the braces are screwed in this example.

Lay your code out so the opening and closing braces match up and make sense to you.

You missed some braces {} and one was in the wrong spot.

Hope this works:

function validateForm() {
var x=document.forms["myForm"]["name"].value;

if (x==null || x=="")
  {
  alert("Name must be filled out");
  return false;
  }

var y=document.forms["myForm"]["password"].value;
  {
if (y==null || y=="")
  alert("Password name must be filled out");
  return false;
 }
}

You misplaced the braces { } for validation of password. Place them after if clause.

I found it on Internet after a long time searching.. But it works just perfect..

The html code

<html>
<head>
<title>Form Validation</title>
<script type="text/javascript">
<!--
// Form validation code will come here.
//-->
</script>
</head>
<body>
 <form action="/cgi-bin/test.cgi" name="myForm"  
          onsubmit="return(validate());">
 <table cellspacing="2" cellpadding="2" border="1">
 <tr>
   <td align="right">Name</td>
   <td><input type="text" name="Name" /></td>
 </tr>
 <tr>
   <td align="right">EMail</td>
   <td><input type="text" name="EMail" /></td>
 </tr>
 <tr>
   <td align="right">Zip Code</td>
   <td><input type="text" name="Zip" /></td>
 </tr>
 <tr>
 <td align="right">Country</td>
 <td>
 <select name="Country">
   <option value="-1" selected>[choose yours]</option>
   <option value="1">USA</option>
   <option value="2">UK</option>
   <option value="3">INDIA</option>
 </select>
 </td>
 </tr>
 <tr>
   <td align="right"></td>
   <td><input type="submit" value="Submit" /></td>
 </tr>
 </table>
 </form>
 </body>
 </html>

the javascript

<script type="text/javascript">
<!--
// Form validation code will come here.
function validate()
{

   if( document.myForm.Name.value == "" )
   {
     alert( "Please provide your name!" );
     document.myForm.Name.focus() ;
     return false;
   }
   if( document.myForm.EMail.value == "" )
   {
     alert( "Please provide your Email!" );
     document.myForm.EMail.focus() ;
     return false;
   }
   if( document.myForm.Zip.value == "" ||
           isNaN( document.myForm.Zip.value ) ||
           document.myForm.Zip.value.length != 5 )
   {
     alert( "Please provide a zip in the format #####." );
     document.myForm.Zip.focus() ;
     return false;
   }
   if( document.myForm.Country.value == "-1" )
   {
     alert( "Please provide your country!" );
     return false;
   }
   return( true );
}
//-->
</script>

and the function for email validation

<script type="text/javascript">
<!--
function validateEmail()
{

   var emailID = document.myForm.EMail.value;
   atpos = emailID.indexOf("@");
   dotpos = emailID.lastIndexOf(".");
   if (atpos < 1 || ( dotpos - atpos < 2 )) 
   {
       alert("Please enter correct email ID")
       document.myForm.EMail.focus() ;
       return false;
   }
   return( true );
}
//-->
</script>

you can check it online here

本文标签: javascriptValidating multiple fields in a formStack Overflow