Introduction
In this article, I explain how to create validations for a Text Box control in ASP.Net. I will start with the following three validations:
- Accept alphanumeric characters
- Accept Alphabet characters
- Accept numeric characters
Requirement
Add the following line in the head section:
- <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
Code
First write the following script in your page to accept alphanumeric characters :
- <script type="text/javascript">
- $(function () {
- $('#txtalphaNumeric').keydown(function (e) {
- if (e.shiftKey || e.ctrlKey || e.altKey) {
- e.preventDefault();
- } else {
- var key = e.keyCode;
- if (!((key == 8) || (key == 32) || (key == 46) || (key >= 35 && key <= 40) || (key >= 65 && key <= 90) || (key >= 48 && key <= 57) || (key >= 96 && key <= 105))) {
- e.preventDefault();
- }
- }
- });
- });
When you have done that code, add a TextBox and provide "txtalphaNumeric" for the id of the TextBox like :
- <asp:TextBox ID="txtalphaNumeric" runat="server"></asp:TextBox>
2. Accept Alphabet characters
First write the following script in your page :
- $(function () {
- $('#txtalphabet').keydown(function (e) {
- if (e.shiftKey || e.ctrlKey || e.altKey) {
- e.preventDefault();
- } else {
- var key = e.keyCode;
- if (!((key == 8) || (key == 32) || (key == 46) || (key >= 35 && key <= 40) || (key >= 65 && key <= 90))) {
- e.preventDefault();
- }
- }
- });
- });
When you have done that code, add a TextBox and provide "txtalphabet" for the id of the TextBox like:
- <asp:TextBox ID="txtalphabet" runat="server"></asp:TextBox>
3. Accept numeric characters
First write the following script in your page :
- $(function () {
- $('#txtNumeric').keydown(function (e) {
- if (e.shiftKey || e.ctrlKey || e.altKey) {
- e.preventDefault();
- } else {
- var key = e.keyCode;
- if (!((key == 8) || (key == 46) || (key >= 35 && key <= 40) || (key >= 48 && key <= 57) || (key >= 96 && key <= 105))) {
- e.preventDefault();
- }
- }
- });
- });
After you have done that code, add a TextBox and provide "txtalphabet" for the id of the TextBox like:
- <asp:TextBox ID="txtNumeric" runat="server"></asp:TextBox>
Complete code
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title>jQuery Allow only alphanumeric characters in TextBox</title>
- <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
- <script type="text/javascript">
- $(function () {
- $('#txtalphaNumeric').keydown(function (e) {
- if (e.shiftKey || e.ctrlKey || e.altKey) {
- e.preventDefault();
- } else {
- var key = e.keyCode;
- if (!((key == 8) || (key == 32) || (key == 46) || (key >= 35 && key <= 40) || (key >= 65 && key <= 90) || (key >= 48 && key <= 57) || (key >= 96 && key <= 105))) {
- e.preventDefault();
- }
- }
- });
- });
-
-
-
- $(function () {
- $('#txtalphabet').keydown(function (e) {
- if (e.shiftKey || e.ctrlKey || e.altKey) {
- e.preventDefault();
- } else {
- var key = e.keyCode;
- if (!((key == 8) || (key == 32) || (key == 46) || (key >= 35 && key <= 40) || (key >= 65 && key <= 90))) {
- e.preventDefault();
- }
- }
- });
- });
-
-
-
- $(function () {
- $('#txtNumeric').keydown(function (e) {
- if (e.shiftKey || e.ctrlKey || e.altKey) {
- e.preventDefault();
- } else {
- var key = e.keyCode;
- if (!((key == 8) || (key == 46) || (key >= 35 && key <= 40) || (key >= 48 && key <= 57) || (key >= 96 && key <= 105))) {
- e.preventDefault();
- }
- }
- });
- });
- </script>
- </head>
- <body>
- <form id="form1" runat="server">
- <div>
- <b>Enter Text:</b><asp:TextBox ID="txtalphaNumeric" runat="server"></asp:TextBox>Accept alphanumeric characters<b><br />
- Enter Text:</b><asp:TextBox ID="txtalphabet" runat="server"></asp:TextBox>
- Accept only Alphabets characters
- Enter text :<asp:TextBox ID="txtNumeric" runat="server"></asp:TextBox>Accept only Numeric values\
- </div>
- </form>
- </body>
- </html>