jQuery Validate Registration Form
In this post we will learn how to validate registration form through jQuery or jQuery Validate Registration Form.
Design:
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1">
<title>jQuery Registration Form Validation</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script language="javascript" type="text/javascript">
$(function() {
$('#validate').click(function() {
var msg = "";
msg+= isvalidusr();
msg+= isvalidFname();
msg+= isvalidLoc();
if (msg != "") {
alert(msg);
return false;
}
else {
return true;
}
})
})
function isvalidusr() {
var temp = $("#txtusr").val();
if (temp == "") {
return ("Please Enter UserName" + "\n");
}
else {
return "";
}
}
function isvalidFname() {
var temp = $("#txtfname").val();
if (temp == "") {
return ("Please Enter firstname" + "\n");
}
else {
return "";
}
}
function isvalidLoc() {
var temp = $("#txtloc").val();
if (temp == "") {
return ("Please Enter City" + "\n");
}
else {
return "";
}
}
</script>
</head>
<body>
<form id="form1">
<table align="center">
<tr><td colspan="2"><h1>jQuery Validate Registration Form</h1></td></tr>
<tr>
<td>UserName</td>
<td>
<input type="text" id="txtusr" />
</td>
</tr>
<tr>
<td>First Name</td>
<td>
<input type="text" id="txtfname" />
</td>
</tr>
<tr>
<td>City</td>
<td>
<input type="text" id="txtloc" />
</td>
</tr>
<tr>
<td></td>
<td>
<input type="button" value="Submit" id="validate" />
</td>
</tr>
</table>
</form>
</body>
</html>