how to validate alpha numeric values in textbox using jquery?

Posted by Hariinakoti under jQuery on 2/22/2013 | Points: 10 | Views : 31410 | Status : [Member] | Replies : 5
Hi all,
how to validate alpha numeric values in textbox using jquery?

Thanks & Regards
Hari



Responses

Posted by: Satyapriyanayak on: 2/22/2013 [Member] [MVP] Silver | Points: 25

Up
0
Down
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Allow Only Alphanumeric Characters in a TextBox</title>
<link href="../CSS/Demos.css" rel="stylesheet" type="text/css" />
<script type='text/javascript'
src='../Scripts/jquery-1.3.2.min.js'>
</script>

<script type="text/javascript">
$(function() {
$('input.alpha[$id=tb1]').keyup(function() {
if (this.value.match(/[^a-zA-Z0-9 ]/g)) {
this.value = this.value.replace(/[^a-zA-Z0-9 ]/g, '');
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div class="bigDiv">
<h2>Allow Only Alphanumeric Characters in a TextBox</h2>
<asp:TextBox ID="tb1" runat="server" class="alpha"
Text="Try entering Non alphanumeric char"
ToolTip="Try entering Non alphanumeric char"/>
<br /><br />

</div>
</form>
</body>
</html>


Refer

http://www.devcurry.com/2009/10/allow-only-alphanumeric-characters-in.html

http://www.c-sharpcorner.com/UploadFile/sapnabeniwal/create-a-alpha-numeric-textbox-using-jquery/


If this post helps you mark it as answer
Thanks

Hariinakoti, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Devi0074u on: 3/12/2013 [Member] Starter | Points: 25

Up
0
Down
Mostly it has to do with Regular expression.
1. You need to create a regular expression to validate the text. /^[a-zA-Z0-9]{1,11}$/
2. Bind the textbox with keypress event.
3. Use the following code.
$('#txtAlpha').keypress(function(e)
{
var code = e.keyCode ? e.keyCode:e.which; // Get the key code.
var pressedKey = String.fromCharCode(code); // Find the key pressed.
if(pressedKey.match(/[a-zA-Z0-9]/g)) // Check if it's a alpanumeric char or not.
{
e.preventDefault(); // If it is not then prevent the event from happening.
}
});

Ready made example can be found here: http://jsfiddle.net/syS4G/

Hariinakoti, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Raj.Trivedi on: 3/12/2013 [Member] [MVP] Starter | Points: 25

Up
0
Down
Hello,

Please check this

http://www.devcurry.com/2009/10/allow-only-alphanumeric-characters-in.html

Regard's
Raj.Trivedi
"Sharing is Caring"
Please mark as answer if your Query is resolved

Hariinakoti, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Dotnetrajanikanth on: 3/13/2013 [Member] Starter | Points: 25

Up
0
Down
You can use the below regular expression for validating.

var alphaNumeric = /^[(a-z)(A-Z)(0-9)]+$/;


____________
www.flickr.com/photos/psdesigner/

Hariinakoti, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Rimi1289 on: 6/13/2013 [Member] Starter | Points: 25

Up
0
Down
Read this if you have time. Its in JQuery.
http://www.encodedna.com/2013/05/enter-only-numbers-using-jquery.htm

Hariinakoti, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response