Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to validate numbers only and email format in contact form

    Hi!
    I would like to show you guys the JavaScript that i using for my contact form


    /*----- Code goes here by clicking the link -----*/
    http://web.ezenne.com/js/completeValid.js

    The above code was copied from a Youtube tutorial about JavaScript.

    I would like to ask, what additional code should be added in the existing code in order to validate the numbers only and an email format before the form to be submitted?

    Thanks!

    Regards,
    Ezenne

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,925
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Quote Originally Posted by ezenne View Post

    I would like to ask, what additional code should be added in the existing code in order to validate the numbers only and an email format before the form to be submitted?

    Form validation has been covered a zillion times in this forum. Try using the Search feature.

    Regex to permit only numbers in the field:-

    if (/[^0-9]/gi.test(numericField.value)) { // invalid


    Regex to check valid email:-

    if (!/^([a-z0-9])([\w\.\-\+])+([a-z0-9]?)\@((\w)([\w\-]?)+\.)+([a-z]{2,4})$/i.test(emailfield.value)) { // invalid


    http://web.ezenne.com/js/completeValid.js is not a valid url.



    Quizmaster: What is the capital of Poland?
    Contestant: Auschwitz.
    Last edited by Philip M; 08-18-2011 at 07:31 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #3
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile How to validate numbers only and email format in contact form

    Originally posted by Philip M:
    Regex to permit only numbers in the field:-

    if (/[^0-9]/gi.test(numericField.value)) { // invalid


    Regex to check valid email:-

    if (!/^([a-z0-9])([\w\.\-\+])+([a-z0-9]?)\@((\w)([\w\-]?)+\.)+([a-z]{2,4})$/i.test(emailfield.value)) { // invalid


    ---------------------------------------------

    Hi Philip M,

    I've no idea how to add the code that you provided in my existing code.

    For example:

    /*---- Example begins ----*/
    This is to validate the empty space in the column.

    if(Name.value == ''){
    msg+= 'Please enter your name! \n';
    Name.className = 'inpBoxError';
    }

    ------------------------------------
    This is to validate the minimum length

    if(Name.value.length < 5){
    msg+= 'Name is too short! \n';
    Name.className = 'inpBoxError';
    }

    ------------------------------------
    How to put the numbers validation code that you provided in this code?

    if(Phone.value == ''){
    msg+= 'Please enter your phone number! \n';
    Phone.className = 'inpBoxError';
    }

    ------------------------------------
    And how to put the email validation code in this code?

    if(Email.value.length < 4){
    msg+= 'Please enter your valid email address! \n';
    Email.className = 'inpBoxError';
    }

    /*---- Example ended ----*/

    Can you show me the way?
    I would really appreciate your help. =)

    Thank you! =)

    Regards,
    Ezenne

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,925
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Quote Originally Posted by ezenne View Post
    How to put the numbers validation code that you provided in this code?

    if(Phone.value == ''){
    msg+= 'Please enter your phone number! \n';
    Phone.className = 'inpBoxError';
    }
    Code:
    if ((Phone.value.length<10)||(/[^0-9]/gi.test(Phone.value))) { // invalid - must be minimum of 10 digits only
    msg+= 'Please enter your phone number without spaces or hyphens! \n';
    Phone.className = 'inpBoxError';
    }
    Quote Originally Posted by ezenne View Post
    And how to put the email validation code in this code?

    if(Email.value.length < 4){
    msg+= 'Please enter your valid email address! \n';
    Email.className = 'inpBoxError';
    }
    Code:
    if (!/^([a-z0-9])([\w\.\-\+])+([a-z0-9]?)\@((\w)([\w\-]?)+\.)+([a-z]{2,4})$/i.test(Email.value)) { // invalid
    msg+= 'Please enter your valid email address! \n';
    Email.className = 'inpBoxError';
    }
    You can improve your name validation as follows:-
    Code:
    // This is to validate the minimum length and only valid characters in the field
    
    Name.value = Name.value.replace(/[^a-z\s\'\-\.]/gi,"";  // strip all but letters space hyphen apostrophe period
    Name.value = Name.value.replace(/\s{2,}/g," ");  // Replace multiple spaces with one space
    if (Name.value.length < 2) {  // an English proper name must have at least two letters - Al, Jo.
    // there are plenty of surnames of only three letters
    msg+= 'Name is too short or contains invalid characters! \n';
    Name.className = 'inpBoxError';
    }
    Last edited by Philip M; 08-19-2011 at 08:28 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #5
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to validate numbers only and email format in contact form

    Hi Philip M,
    Thank you very much for your helps!
    They are all working fine for me. Amazing!!

    Do you have any tutorial sites for me to learn a proper Java Script?
    I am only know well in CSS and HTML.
    Have to go to a higher level in website creation.

    Again, thank you very much for your help in coding issue! =)

    Regards,
    Ezenne

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,925
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    The best resource apart from this forum is W3Schools Online Web Tutorials
    www.w3schools.com/ (although some sections are somewhat dated). Also http://www.javascriptkit.com/

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #7
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to validate numbers only and email format in contact form

    Hi Philip M,
    Thanks for your suggestions!

    That's a great sites with lots of knowledges that we can learn.

    Thank you very much.

    Regards,
    Ezenne


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •