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 4 of 4
  1. #1
    New Coder
    Join Date
    Jun 2008
    Posts
    11
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Form Validation - but not in a pop-up window?

    I have read through tutorials where they have form validation that validates when the clicks "submit" button.

    What I am needing is, the form being validated in real time. It seems un-usual i know, but I have seen it somewhere, I cant remember where though.

    What I mean is:



    Where, in realtime, the form is constantly validating, so after the user inputs his email wrong in the second box, on the side, it tells the user, you emails are different as shown.

    Thanks for looking, and as always, any help would be much appreciated.

    **I am writing this form validation in JavaScript - clientside.

    **I am however looking at learning and moving this site to asp.net, so if I cant do this with JavaScript, client-side, could I do this with asp.net?
    Last edited by thecodemeist3r; 06-16-2008 at 01:42 PM.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,907
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    In fact validation as the user fills in the form is very common.

    Here is an example of what you want:-

    Code:
    <form name = "myform">
    Enter your email address <input type = "text" name = "email1" id = "email1" size = 30><br>
    Confirm your email address <input type = "text" name = "email2" id = "email2" size = 30 onblur = "chkEmail()">
    <span style = "color:FF0000; font-size:10pt" name = "warning" id = "warning"</span> 
    <br><br>
    </form>
    
    <script type = "text/javascript">
    function chkEmail() {
    document.getElementById("warning").innerHTML = "";
    var em1 = document.getElementById("email1").value;
    var em2 = document.getElementById("email2").value;
    if (em1 != em2) {
    document.getElementById("warning").innerHTML = " The two email addresses do not match. Try again!";
    document.getElementById("email1").value = "";
    document.getElementById("email2").value = "";
    document.getElementById("email1").focus();
    return false;
    }
    if (!(/^([a-z0-9])([\w\.\-\+])+([a-z0-9])\@(([\w\-]?)+\.)+([a-z]{2,4})$/i.test(em1))) {  // invalid email address
    document.getElementById("warning").innerHTML = " The email address is not valid!  Try again!";
    document.getElementById("email1").value = "";
    document.getElementById("email2").value = "";
    document.getElementById("email1").focus();
    return false;
    }
    alert ("Email addresses match and are valid ");  // delete this line after testing
    }
    </script>

    Remember that JavaScript form validation only provides convenience for users, not security. This means that JavaScript should be used as an "enhancement", not as a requirement. So your form should not be dependent on JavaScript alone to perform your validation. Instead, whatever server-side language you use to process the form (PERL, ASP, PHP, etc.) should also perform the same validation. Otherwise, people will be able to bypass your validation simply by disabling JavaScript.



    All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.
    Last edited by Philip M; 06-16-2008 at 03:43 PM. Reason: Add note re server-side validation

  • Users who have thanked Philip M for this post:

    thecodemeist3r (06-17-2008)

  • #3
    New Coder
    Join Date
    Jun 2008
    Posts
    11
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Thanks for the script.

    I have also read that form validation should both use client side and and server side validation for that very reason, however, I, at this point in time, do not know any server side languages unfortunately.

  • #4
    New Coder
    Join Date
    Jun 2008
    Location
    127.0.0.1
    Posts
    43
    Thanks
    1
    Thanked 6 Times in 6 Posts


  •  

    Posting Permissions

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