In the HTML form submission, some times we require to insert only valid Email id and only entering numeric value in input field. so in this tutorial i am showing you how to use validation in JavaScript form and type of form.


     <label>Email Id</label>
     <input type="text" id="user_email" name="user_email">
     <input type="button" onclick="submitemail() " id="submit" name="submit" value="Submit">
</form>

In the <head> section create on function with the name submitemail() that we have mention into the form submit button.


     function submitemail()
       {
          var user_email = document.getElementById('email').value;
          var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;

          if (!filter.test(user_email)) {
                    alert('Please provide a valid email address');
                    email.focus;
                    return false;
                 }
       } 





First make a form in HTML and create one submit button in this form After entering the email id press enter then submitemail() function will call and will validate your email id

Validation for Numeric Value in input field
In this Numeric value validation, need to create form and build one input field mobile number and allow maxlength = 12.
and along with that use and call one function named  isNumber(event).



     <label>Mobile Number</label>
     <input type="text" id="user_mobile" name="user_mobile">
     <input type="button" onclick="submitmobileno.()"  maxlength="12" onkeypress="return isNumber(event)" id="submit" name="submit" value="Submit">

Then make one function in script area or under the <head> Tag.


function isNumber(evt) {
    evt = (evt) ? evt : window.event;
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode > 31 && (charCode < 48 || charCode > 57)) {
      return false;
      }
    return true;
} 


And make one JavaScript code for blank number submission or not.


var user_mobile = document.getElementById('mobile').value;
    //alert(user_mobile.length);
    if(user_mobile==null || user_mobile=="")
        {
         alert("Please Fill Mobile Number");
         return false;
        }
     else if ((user_mobile.length <10) || (user_mobile.length >10) )
       {
           alert("Mobile No. Should be of 10 Digit.");
           return false;
       }

These are the simple validation for validate the email id and mobile or numeric value.

You Would Also Like This: -



0 comments :

Post a Comment

 
# Top