Javascript form validation

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
ranura
Forum Newbie
Posts: 4
Joined: Sun May 13, 2012 6:41 am

Javascript form validation

Post by ranura »

I have this html page

----------------------------

Code: Select all

<html>
<head>
<script type="text/javascript">
function validation(form){
		if(form.aut_make.value==""){
			document.getElementById("id_aut_make").innerHTML = "You must enter the make";
            return false;
		}else{
			document.getElementById("id_aut_make").innerHTML = "";
        }
		if(form.aut_type.value==""){
			document.getElementById("id_aut_type").innerHTML = "You must enter the type";
			return false;
		}else{
			document.getElementById("id_aut_type").innerHTML = "";
		}
		if(form.aut_model.value==""){
			document.getElementById("id_aut_model").innerHTML = "You must enter the model";
			return false;
		}else{
			document.getElementById("id_aut_model").innerHTML = "";
		}
}
</script>
</head>

<body>
				<form action="2.html" method="post" onSubmit="return validation(this)">
					<table>
						<tr>
							<td width="75px">Make</td>
							<td>
								<input type="text" name="aut_make" style="width: 172px;">
							</td>
							<td>
								<div style="color:#FF0000; " id="id_aut_make"> </div>
							</td>
						</tr>
						<tr>
							<td width="75px">Type</td>
							<td>
								<input type="text" name="aut_type" style="width: 172px;">
							</td>
							<td>
								<div style="color:#FF0000; " id="id_aut_type"> </div>
							</td>
						</tr>
						<tr>
							<td width="75px">Model</td>
							<td>
								<input type="text" name="aut_model" style="width: 172px;">
							</td>
							<td>
								<div style="color:#FF0000; " id="id_aut_model"> </div>
							</td>
						</tr>
						<tr>
							<td width="75px"></td>
							<td>
								<input type="submit" name="aut_submit" value="Submit">
							</td>
							<td></td>
						</tr>
					</table>
				</form>
</body>
</html>
----------------------------

This form validates whether user filled all 3 fields or not. If the user didin't fill the form (3 fields) and submits, it displays one validation message at a time. I need to display all 3 validations at the same time.

How can I do this?
Thank you.
User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: Javascript form validation

Post by Christopher »

Code: Select all

function validation(form){
	var result = true;
	if(form.aut_make.value==""){
		document.getElementById("id_aut_make").innerHTML = "You must enter the make";
        result = false;
	} else {
		document.getElementById("id_aut_make").innerHTML = "";
	}
	if(form.aut_type.value==""){
		document.getElementById("id_aut_type").innerHTML = "You must enter the type";
        result = false;
	}else{
		document.getElementById("id_aut_type").innerHTML = "";
	}
	if(form.aut_model.value==""){
		document.getElementById("id_aut_model").innerHTML = "You must enter the model";
        result = false;
	}else{
		document.getElementById("id_aut_model").innerHTML = "";
	}
	return result;
}
(#10850)
Post Reply