asked on

Simple form validation question.

Instead of me diving in books and learn JavaScipt, with which I don't have the time. I just need a simple validation solution.

I have a few fields in my form, and would like to validate if they are blank or empty.

Here is some code I am testing with:
<html>
<head>
<script type='text/javascript'>
function checkRequired(){
if (form.empName.value == "")
{alert("You have left a required field blank.");}
}
</script>
</head>
<body>
<form>
<input name=empName type='text' onblur=checkRequired()>
<input name=empPhone type='text' onblur=checkRequired()>
<input name=empEmail type='text' onblur=checkRequired()>
</form>
</body>
</html>

What I want to do is be able to send the name of the field into the javascript so it can check that field, if it is blank I want it to give the alert, and set focus back on that field. That is all, I have seen this code work before, but can't recall where. I said it was simple. Help would be greatly appreciated, and thank you.

mattfairw

a better method would be to check on submit:

<html>
<head>
<script type='text/javascript'>
function checkRequired(theForm){
if (theForm.empName.value == "" || theForm.empPhone.value == "" || theForm.empEmail.value == "")
{
alert("You have left a required field blank.");
return false;
}
return true;
}
</script>
</head>
<body>
<form action="newPage.ext" onSubmit="return checkRequired(this)>
<input name=empName type='text'>
<input name=empPhone type='text'>
<input name=empEmail type='text'>
</form>
</body>
</html>

mattfairw

and a little modification (i left out a quote and a submit button ;) )

<html>
<head>
<script type='text/javascript'>
function checkRequired(theForm){
if (theForm.empName.value == "" || theForm.empPhone.value == "" || theForm.empEmail.value == "")
{
alert("You have left a required field blank.");
return false;
}
return true;
}
</script>
</head>
<body>
<form action="newPage.ext" onSubmit="return checkRequired(this)">
<input name=empName type='text'>
<input name=empPhone type='text'>
<input name=empEmail type='text'>
<input type="submit" name="subBtn" value="Submit" />
</form>
</body>
</html>

-Matt

Meps

ASKER

I wish I could use onSubmit, but my real page causes this to be an impossiblilty.

Here is what I have so far.
<SCRIPT>
function checkRequired(field){
if (field.value == "")
{alert("You have left a required field blank. \n Please ensure all fields are completed.");
field.focus();}
}
</SCRIPT>

The only problem is that if the customer clicks on the name field, then tabs over to another field, you run into a loop where both the name and the phone switch off with the error.

I saw this site, but I don't understand where the timeout comes into play.
http://forums.aspfree.com/t22355/s.html

ASKER CERTIFIED SOLUTION

mattfairw

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Meps

ASKER

Thanks a lot for the help. It worked very well.