In this article I will explain with an example, how to use
Regular Expression (Regex) to accept/allow only Numbers (Digits) in TextBox in ASP.Net.
The above validation can be done using:
1. RegularExpression Validator.
2. JavaScript.
3. jQuery.
1. Regular Expression (Regex) to accept only Numbers (Digits) in TextBox using RegularExpression Validator
HTML Markup
The HTML Markup consists of following controls:
TextBox – For capturing user input.
RegularExpressionValidator – For defining the validation.
The RegularExpressionValidator has been assigned with the following properties:
ControlToValidate – For defining Control ID which will be validated.
ValidationExpression – For defining the validation expression.
ErrorMesage – For displaying Error Message when validation fails.
Button – For validating TextBox.
<u>1. Using Regular Expression Validator</u>
<hr />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br />
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="TextBox1" ForeColor="Red"
ErrorMessage="Only Numbers allowed" ValidationExpression="\d+">
</asp:RegularExpressionValidator>
<br />
<asp:Button ID="Button1" Text="Validate" runat="server"/>
2. Regular Expression (Regex) to accept only Numbers (Digits) in TextBox using JavaScript
HTML Markup
The HTML Markup consists of following element and controls:
TextBox – For capturing user input.
SPAN – For displaying Error Message.
Button – For validating TextBox.
The Button has been assigned with the following properties:
CausesValidation – For specifying if page is validated or not. Here it is set to FALSE.
The Button has been assigned with an OnClientClick event handler.
Validate
Inside the
Validate JavaScript function, a Boolean variable is created which is set to FALSE and a Regular Expression is defined.
Then, the TextBox value is validated against the
Regular Expression and based on the validation an HTML SPAN is made hidden or shown.
<u>2. Using Regular Expression and JavaScript</u>
<hr />
<asp:TextBox ID="TextBox2"runat="server" />
<br />
<span id="spnError" style="color: Red; display: none">Only Numbers allowed</span>
<br/>
<asp:Button ID="Button2" Text="Validate" runat="server" CausesValidation="false"
OnClientClick="return Validate()"/>
<script type="text/javascript">
function Validate() {
var isValid = false;
var regex = /^\d+/;
isValid = regex.test(document.getElementById("<%=TextBox2.ClientID %>").value);
document.getElementById("spnError").style.display = !isValid ? "block" : "none";
return isValid;
}
</script>
3. Regular Expression (Regex) to accept only Numbers (Digits) in TextBox using jQuery
HTML Markup
The HTML Markup consists of following element and controls:
TextBox – For capturing user input.
SPAN – For displaying Error Message.
Button – For validating TextBox.
The Button has been assigned with the following properties:
CausesValidation – For specifying if page is validated or not. Here it is set to FALSE.
Inside the
jQuery document ready event handler, the Button is assigned with a
click event handler.
Inside the click event handler, a Boolean variable is created which is set to FALSE and a Regular Expression is defined.
Then, the TextBox value is validated against the
Regular Expression and based on the validation an HTML SPAN is made hidden or shown.
<u>3. Using Regular Expression and jQuery</u>
<hr/>
<asp:TextBox ID="TextBox3"runat="server" />
<br/>
<span id="spnError2" style="color: Red; display: none">Only Numbers allowed</span>
<br />
<asp:Button ID="btnValidate" Text="Validate" runat="server" CausesValidation="false"/>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("[id*=btnValidate]").bind("click", function () {
var isValid = false;
var regex = /^\d+/;
isValid = regex.test($("[id*=TextBox3]").val());
$("#spnError2").css("display", !isValid ? "block" : "none");
return isValid;
});
});
</script>
Screenshot
![Regular Expression (Regex) to accept only Numeric (Numbers) in TextBox in ASP.Net]()
Demo
Downloads
