Introduction
Here
I will explain how to validate user registration form in JavaScript with
source code or JavaScript user registration form validation.
Description:
In
previous article I explained how to set watermark text for textbox using JavaScript, Remove duplicate values from string array in JavaScript, Disable drag and drop options in textbox or textarea controls,
JavaScript show number of characters left in textbox and
many articles relating to asp.net,
jQuery,
JavaScript. Now I will explain how to implement
registration form validation in JavaScript
source code.
To implement this we need to write the
code as shown below
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1"
runat="server">
<title>Registration Form Validation in JavaScript Source Code</title>
<script language="javascript" type="text/javascript">
function validate() {
var summary = "";
summary += isvaliduser();
summary += isvalidFirstname();
summary += isvalidLocation();
if (summary != "")
{
alert(summary);
return false;
}
else {
return true;
}
}
function isvaliduser() {
var uid;
var temp = document.getElementById("<%=txtuser.ClientID
%>");
uid = temp.value;
if (uid == "") {
return ("Please
Enter UserName" + "\n");
}
else {
return "";
}
}
function isvalidFirstname() {
var uid;
var temp = document.getElementById("<%=txtfname.ClientID
%>");
uid = temp.value;
if (uid == "") {
return ("Please
enter firstname" + "\n");
}
else {
return "";
}
}
function isvalidLocation() {
var uid;
var temp = document.getElementById("<%=txtlocation.ClientID
%>");
uid = temp.value;
if (uid == "") {
return ("Please
enter Location" + "\n");
}
else {
return "";
}
}
</script>
</head>
<body>
<form id="form1"
runat="server">
<table align="center">
<tr>
<td>UserName</td>
<td><asp:TextBox ID="txtuser"
runat="server"
/></td>
</tr>
<tr>
<td>First Name</td>
<td><asp:TextBox ID="txtfname"
runat="server"
/></td>
</tr>
<tr>
<td>Location</td>
<td><asp:TextBox ID="txtlocation"
runat="server"
/></td>
</tr>
<tr>
<td></td>
<td>
<asp:Button ID="btnsubmit"
runat="server"
Text="Save"
OnClientClick ="javascript:validate()"
/>
</td>
</tr>
</table>
</form>
</body>
</html>
|
Live
Demo
To check for live demo try to click on below button
|
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
|
|||
11 comments :
hi,
could you post linq classes it will be useful to many.
Regards,
Jagadeesh
Hi Suresh. You have posted a very good code but can u plz post a code where we can do validations on blur.
I mean in this example the code is done on button which is ok but what if i want to check the validations on blur effect of controls like checkboxlist, textbox , fileupload etc with some jquery animations. It would be really helpful if you do so.
Hi,
I have developed a system using VS ASP.Net 4.0 using C#, i have more than 45 web forms that i want to add validations text boxes with different id names.
So i want to apply the validations to more than 14 text boxes on a web form. how do you do it...I also want the following;
1.Validate for numbers only and change color of the text box to red.
2.Validate for Letters only only and change color of the text box to red.
Validate for invalid email address and change color of the text box to red.
4.Validate the range of date. e.g if he/she enters invalid date like 05/05/2001 ,i need the current date.
5.Highlight the text box to red for a required text box.
Good for Beginners
while am giving spaces it Allows...
sir i have added a event OnClick="btnpuja_Click" in button contron..it work fine but when in click on alert message(ok) it reload the page and emty data save in my db..plz help
www.google.com
Thank you for your validation code It is working Perfectly
thank you for your validation code it use fully my project working......
NOTE:
Aftr doing these Steps ..Add these button attributes...this help to avoid empty data save..
protected void Page_Load(object sender, EventArgs e)
{
Button1.Attributes.Add("onClick", "javascript:return check()");
}
Note: Only a member of this blog may post a comment.