[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 222
  • Last Modified:

restrict the user to eneter numbers,alpahbets and @ in a input box...

Hi,
How can i restrict the user to eneter numbers,alpahbets and @ in a input box.

George
0
knightrgv
Asked:
knightrgv
  • 4
  • 3
  • 2
  • +1
1 Solution
 
CyberSoftCommented:
Hi knightrgv

This should give you a good idea how to do it using Regular Expressions.

<!-- ----- code example starts here ----- -->
<html>
<head>
     <title>Email validation example</title>
     <script language="JavaScript">
          var emailexp = /^[a-z][a-z_0-9\.]+@[a-z_0-9\.]+\.[a-z]/i
         
          function isValid(pattern, str)
          {
               return pattern.test(str)
          }
         
          function validateEmail(emailField)
          {
               if (!isValid(emailexp, emailField.value))
               {
                    alert("Invalid email")
                    emailField.focus()
                    return false
               }
               
               return true
          }
     </script>
</head>

<body>

Email address must be of the form something@somewhere.somewhereelse
<BR>
(ie as long as it has something before the @ symbol as well as something after
<BR>
the @ symbol a period and something after the priod, each of any length)
<BR><BR>
<form id="frm" name="frm" method="post" action="nextPage.html" onsubmit="return validateEmail(document.forms['frm'].txtEmail)">
     Email: <input type="text" name="txtEmail" id="txtEmail">
     <input type="submit" value="Submit" name-"submit">
</form>

</body>
</html>

<!-- ----- code example ends here ----- -->


Regards,
CyberSoft
0
 
knightrgvAuthor Commented:
Hi,
I am sorry. But i am not able to interpret this
var emailexp = /^[a-z][a-z_0-9\.]+@[a-z_0-9\.]+\.[a-z]/i

I only want the user to restricy the user from entering anything other than
1.numbers
2.alphabets
3.@

Can you help some more?

Thanks again,
Knightrgv
0
 
CJ_SCommented:
function checkVal(obj)
{
    var validCharacters="abcdefghijklmnopqrstuvwxyz";
    var curVal = obj.value;
    var tmpVal = ""
    var bValid = true;
    for(i=0;i<curVal.length;i++)
     if(validCharacters.indexOf(curVal.charAt(i))<0)
       tmpVal += curVal.charAt(i);
     else bValid=false
    if(bValid==false)
    {
       alert("illegal characters encountered");
       obj.value=tmpVal;
    }    
}

and call it like
<input type=text onKeyUp="checkVal(this)">

Regards,
CJ
0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
CJ_SCommented:
oh, and add any valid characters to the validCharacters variable.
0
 
CyberSoftCommented:
That is exactly what that bit of code will do. It's called regular expressions. What that line means is that will allow characters (a to z) and numbers (0 to 9) as well as one @ symbol and at least one period (.)

Regards,
CyberSoft
0
 
knightrgvAuthor Commented:
Hi,
Thank you for the code. But one more problem.

How come i am able to enter only one character in my input box? What should i change to enter more than one.

Knightrgv
0
 
labcoatCommented:
knightrgv,

the original comment by CyberSoft gave you WILL work.

He is right, it is a regular expression which is the most efficient way to do any sort of [string] validation/manipulation.

You can also enter more than one character in his example.

Cut-n-paste it and test it - see for your self.

You should give him credit for that comment.

--labcoat
0
 
CyberSoftCommented:
Thanks labcoat - an added advantage is it's also cross-browser compatible.

Regards,
CyberSoft
0
 
knightrgvAuthor Commented:
The code worked great. Thank you.
0
 
CyberSoftCommented:
Always a pleasure to help out. After all thats why we're here.

Regards,
CyberSoft
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 4
  • 3
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now