JavaScript - Text box that allows only alphabets on client side only

Asked By koteswara rao arvapalli on 25-Nov-11 06:57 AM

<asp:TextBox ID="txtdegree" Width="154px"
runat="server" SkinID="TextBox" TabIndex="8"></asp:TextBox> i wish to this allows only alphabets only


<asp:TextBox ID="txtphone" Width="154px"
runat="server" SkinID="TextBox" TabIndex="8"></asp:TextBox> i wish to this allows only integers only

using java script only , how to write?

please send the solution  immeditlely
Jitendra Faye replied to koteswara rao arvapalli on 25-Nov-11 06:59 AM

Try this code-





var regexNum = /\d/;

var

regexLetter = /[a-zA-z]/;

if

(!regexNum.test(textbox.value) || !regexLetter.test(textbox.value)){

alert('Type alphanumeric character');

return

false;

}

Reena Jain replied to koteswara rao arvapalli on 25-Nov-11 07:04 AM
hi,

here is the code for you

private void textBox4_KeyPress(object sender, KeyPressEventArgs e)
{
if ((e.KeyChar >= 65 && e.KeyChar <= 90) || (e.KeyChar >= 97 && e.KeyChar <= 122) || e.KeyChar == 32 || e.KeyChar == 8 || (e.KeyChar > 47 && e.KeyChar < 58) || (e.KeyChar == 46) || (e.KeyChar == 8))
{
e.Handled = false;
}
else
{
e.Handled = true;
}
}

I would like to give you keycode also for my above code
  • keychar 65 to 90 is for 'A' to 'Z'
  • keychar 97 to 122 is for 'a' to 'z'
  • keychar 8 is for backspace
  • keychar 47 to 58 is for 0 to 9
but i will suggest if you are using asp.net then you should use client side validation for it, like this
function AllowAlphabet(e)
 
{
 
  isIE = document.all ? 1 : 0
 
  keyEntry = !isIE ? e.which : event.keyCode;
 
  if (((keyEntry >= '65') && (keyEntry <= '90')) || ((keyEntry >= '97') && (keyEntry <= '122')) || (keyEntry == '46') || (keyEntry == '32') || keyEntry == '45')
 
   return true;
 
  else
 
{
 
  alert('Please Enter Only Character values.');
 
  return false;
 
  }
 
}
<asp:TextBox ID="TextBox1" runat="server" MaxLength="1" onkeypress="return AllowAlphabet(event)"></asp:TextBox>

or
use customer validator, custom validator is just provide u put your own function to validate so u need to write code for validate character only using regular expression in case of using custom validator control
so better is u can use regular expression in Regularexpression validator control this is specific validator control for validate with regular expression
<asp:RegularExpressionValidator id="valRegEx" runat="server"
  ControlToValidate="textbox1"
  ValidationExpression="[^a-z][A-Z]+$"
  ErrorMessage="* entry only character value."
  display="dynamic">*
</asp:RegularExpressionValidator>
dipa ahuja replied to koteswara rao arvapalli on 25-Nov-11 07:09 AM
Don't Repeat the same post  <script type="text/javascript">
  function chk(obj) { 
  obj.value = obj.value.replace(/[^a-z]/gi, '') 
  }
</script>
 
<input type="text" value="" onkeyup="chk(this)"/>
Using Validation Control
 <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server"
ErrorMessage="Enter Characters Only" Display="Dynamic" ControlToValidate="TextBox1"
ValidationExpression="^[a-zA-Z'.]{1,40}$">
Enter Characters Only</asp:RegularExpressionValidator>
Suchit shah replied to koteswara rao arvapalli on 25-Nov-11 07:15 AM

Try this:

<asp:TextBox ID="TextBox1" runat="server" onchange="alphaOnlyTextBox(this, 25);"></asp:TextBox>

<script type="text/javascript">
<!--
function alphaOnlyTextBox(elementRef, maxLimit)
{
 var textValue = elementRef.value;

 var regExObject = /.*[a-zA-Z].*/;

 if ( textValue.length <= 0 )
 {
  alert('Please enter a value.');
  elementRef.focus();
  elementRef.select();
  return false;
 }

 if ( textValue.length > maxLimit )
 {
  alert('Only up to ' + maxLimit + ' characters are allowed');
  elementRef.focus();
  elementRef.select();
  return false;
 }

 if ( regExObject.test(textValue) )
 {
  return true;
 }
 else
 {
  alert('Only characters a - z, or A - Z are allowed');
  elementRef.focus();
  elementRef.select();
  return false;
 }

 return true;
}
// -->
</script>

Note that I attached the event handler to the element in the HTML declaration. This will work, but will produce a compiler warning. The proper way to do this for a server control is in the Page_Load handler of the server-side code like this:
 TextBox1.Attributes.Add("onchange", "alphaOnlyTextBox(this, 25);");

aneesa replied to koteswara rao arvapalli on 28-Nov-11 12:16 AM
JAVASCRIPT FOR TEXTBOX ALLOW ONLY ALPHABETS
 
if (!FormName.text.value.match(/^[a-zA-Z]+$/))
{
       alert("Please Enter <strong class="highlight">only</strong> letters in <strong class="highlight">text</strong>");
}

METHOD:2

<html>
<head>
<script type = "text/javascript">
function AllowAlphabet(){
if (!TEST.TESTER.value.match(/^[a-zA-Z]+$/) && TEST.TESTER.value !="")
{
TEST.TESTER.value="";
TEST.TESTER.focus();
alert("Please Enter only alphabets in text");
}
}
 
</script>
</head>
<body>
<form name="TEST">
<input type="text" name="TESTER" onkeyup="AllowAlphabet()">
</form>
</body>
</html>



Allow only numbers/digits in TextBox

<HTML>
   <HEAD>
   <SCRIPT language=Javascript>
      <!--
      function isNumberKey(evt)
      {
         var charCode = (evt.which) ? evt.which : event.keyCode
         if (charCode > 31 && (charCode < 48 || charCode > 57))
            return false;
         return true;
      }
      //-->
   </SCRIPT>
   </HEAD>
   <BODY>
      <INPUT id="txtChar" onkeypress="return isNumberKey(event)" type="text" name="txtChar">
   </BODY>
</HTML>