PNG
PNG

Reputation: 285

Javascript validation onkeypress function

In web form, I have multiple fields and each field have some unique validation like phone and zip code have only number and some of the fields do not allow special characters. So how do I validate each field?

Now I validating like

function isNumberKey(evt)
      {
         var charCode = (evt.which) ? evt.which : event.keyCode
        if (charCode > 32 && (charCode < 48 || charCode > 57)||(charCode==32))

        return false;

        return true;
      } 

function isAlphaNumericKey(evt)
    {
    var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode > 32 && (charCode < 65 || charCode > 90) && (charCode < 97 || charCode > 122)&& (charCode < 48 || charCode > 57))
    return false;
    return true;
    }  

and some cases I need to allow some special characters like

function isANhypenKey(evt)
    {
    var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode > 32 && (charCode < 65 || charCode > 90) && (charCode < 97 || charCode > 122)&& (charCode < 48 || charCode > 57) && (charCode!=44) && (charCode!=45))
    return false;
    return true;
    }  

and HTML form

<input type="text"  name="zipcode" id="zipcode" onkeypress="return isNumberKey(event);"/>
<input type="text"  name="shipname"  id="shipname"  onkeypress="return isANhypenKey(event);"  />

How to reduce my JS code. Can I get any JS library file for this or JS function can solve this? Thanks

Upvotes: 0

Views: 10164

Answers (4)

Joeppie
Joeppie

Reputation: 447

This may or may not be the answer you are looking for, but perhaps you should be looking at a solution that requires less JavaScript:

In HTML 5, you can specify the type of value that an input is supposed to accept using a pattern, you can read about this on this mozilla page or by reading the answers on this question: HTML5 Form Pattern / Validation.

<input type="text" name="country_code" pattern="put a regex here that describes only valid input for your situations" title="Three letter country code">

Note that not all browsers (primarily Safari and older IE) currently support the pattern attribute.

Another thing of note is that it may be preferable to use a RegEx in your JavaScript code, should that be the preferred solution.

Upvotes: 1

ivan.mylyanyk
ivan.mylyanyk

Reputation: 2101

You may take a look to the jQuery validation plugin - it's very useful, you also easily can add validation errors to the form so user will know what is wrong with it's input.

In this way you will avoid a lot of manual JS-validation code.

Upvotes: 0

user3883448
user3883448

Reputation:

yeah http://rickharrison.github.io/validate.js/ best and simple to use check that link

Upvotes: 0

Nischaal Cooray
Nischaal Cooray

Reputation: 210

There are a couple of libraries that you could use. If you want to stick to pure JavaScript without any jQuery, then your best option would probably be Validate JS.

There are a ton of jQuery options if you are willing to work with jQuery - these are usually more feature packed and nicer to look at too. You could also use the Validator built into the Foundation Framework - it's called Abide but it uses jQuery.

Hope this helps.

Upvotes: 2

Related Questions