How to Validate the number range using JavaScript in asp.net ~ Asp.Net,C#.Net,VB.Net,MVC,jQuery,JavaScipt,AJAX,WCF,Sql Server example

Introduction: In previous articles i explained How to enable JavaScript in asp.net and how to implement JavaScript validation in asp.net website and Example to implement Jquery form validations in asp.net and Retain password value in the asp.net TextBox after postback event and How to maintain image on PostBack in FileUpload control and How to create log file to record errors and exceptions in asp.net and Validate asp.net CheckBoxList using jQuery and Validate DropDownList using jQuery
In this article I am going to explain with example How to validate the number range using JavaScript in asp.net.

validate number range using JavaScript in asp.net

Source Code:

In the <Head> tag of the design page (.aspx) create the JavaScript function to validate the number range of values e.g. we are validating the age to be between 18 – 25. I have created the validation function using AND (&&) logical operator and using nested if (or we can say else-if ladder) .You can use any one of the two validateAge() functions.

Using AND (&&) Operator

function validateAge() {

var txtVal = document.getElementById("<%=txtAge.ClientID%>").value;

if (txtVal >= 18 && txtVal <= 25) {

return true;

}

else

alert('Age must be between 18-25');

return false;

}

</script>

<noscript> <h3 style="color: #FF3300;">

Javascript is not currently enabled in your browser.<br /> You must <a href="http://support.google.com/bin/answer.py?hl=en&answer=23852" target="_blank">enable Javascript </a> to run this web page correctly.

</h3></noscript>

Using else-if ladder

function validateAge()

{

var txtVal = document.getElementById("<%=txtAge.ClientID%>").value;

if (txtVal < 18)

{

alert('Age must be greater than 18');

return false;

}

else if (txtVal > 25)

{

alert('Age must be lesser than 25');

return false;

}

else

return true;

}

</script>

<noscript> <h3 style="color: #FF3300;">

</h3></noscript>

In the <Body> tag of the design page (.aspx) place a TextBox control and a Button control on the page. We will call the function to validate the number range created on the Button’s OnclientClick event.

<legend>Validate range using JavaScript in asp.net</legend>

<table>

<tr>

<td>

<asp:TextBox ID="txtAge" runat="server"></asp:TextBox>

</td>

<td>

<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" OnClientClick="javascript:return validateAge();" />

</td>

</tr>

</table>

</fieldset>

C#.Net code to validate the number range using JavaScript in asp.net

In the code behind file (.aspx.cs) write the following lines on the Submit Button's click event

protected void btnSubmit_Click(object sender, EventArgs e)
{
ScriptManager.RegisterClientScriptBlock(Page, Page.GetType(), Guid.NewGuid().ToString(), "alert('Entered value is ' + '" + txtAge.Text.Trim() + "');", true);
}

VB.Net Code to validate the number range using JavaScript in asp.net

Design the page(.aspx) same as in C#.net section but replace the line

<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" OnClientClick="javascript:return validateAge();" /> with the line <asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClientClick="javascript:return validateAge();" />

In the code behind file (.aspx.vb) write the following lines on the Submit Button's click event

Protected Sub btnSubmit_Click(sender As Object, e As EventArgs) Handles btnSubmit.Click

ScriptManager.RegisterClientScriptBlock(Page, Page.GetType(), Guid.NewGuid().ToString(), "alert('Entered value is ' + '" + txtAge.Text.Trim() + "');", True)
End Sub

Now run the web application and enter number/value greater than 25 or less than 18, it will show the error alert/ message as shown below otherwise the valid entered value will be shown in alert box/message box

Now over to you:

"If you like my work; you can appreciate by leaving your comments, hitting Facebook like button, following on Google+, Twitter, Linked in and Pinterest, stumbling my posts on stumble upon and subscribing for receiving free updates directly to your inbox . Stay tuned and stay connected for more technical updates."

If you have any question about any post, Feel free to ask.You can simply drop a comment below post or contact via Contact Us form. Your feedback and suggestions will be highly appreciated. Also try to leave comments from your account not from the anonymous account so that i can respond to you easily..

How to Validate the number range using JavaScript in asp.net

Related Post