Menu
Hi, I want to validate a form using javascript. On submit, I want it to check each text box, and if there was an error, instead of deleting the values in the text box, I want it to give a message on the top of the page and not have any of the values deleted.
I am currently only working on the first name text box, once I get that down, I reckon I can expand it and work on the rest using the same method.
[CODE]
<html>
<head>
<title>Form</title>
<style type=”text/css”>
input {margin:5px}
div
{
width:150px;
float:left;
overflow:hidden;
}
</style>
<script type=”text/javascript”>
<!–
function validate( form )
{
var regexpstr=/^[a-zA-Z]+$/;
var fname=form.first_name.value;
if(fname==” “||fname==””){
alert(“Please enter your first name”);
return false;
}
else if(fname.match(regexpstr)){
alert(“OK”);
return true;
}
else{
alert(“Please check if you have entered your first name correctly”);
return false;
}
}
–>
</script>
</head>
<body>
<form onsubmit=”return validate(this)”>
<div>First Name: </div>
<input type=”text” name=”first_name” size=”11″ /> <br />
<!–
<div>Surname: </div>
<input type=”text” name=”surname” size=”11″ /> <br />
<div>Address Line 1:</div>
<input type=”text” name=”address_line_1″ size=”20″ /> <br />
<div>Address Line 2: </div>
<input type=”text” name=”address_line_2″ size=”20″ “/> <br />
<div>City: </div>
<input type=”text” name=”city” size=”20″ /> <br />
<div>Postcode: </div>
<input type=”text” name=”postcode” size=”20″ /> <br />
<div>Phone Number: </div>
<input type=”text” name=”phone” size=”20″ /> <br />
<br />
–>
<input type=”submit” name=”submit” value=”Submit” />
</form>
</body>
</html>