Skip to content

Instantly share code, notes, and snippets.

@GeoffCrittenden
Forked from ksolo/form-validator.js
Created September 27, 2013 14:04
Show Gist options
  • Select an option

  • Save GeoffCrittenden/6729100 to your computer and use it in GitHub Desktop.

Select an option

Save GeoffCrittenden/6729100 to your computer and use it in GitHub Desktop.

Revisions

  1. GeoffCrittenden revised this gist Sep 27, 2013. 1 changed file with 27 additions and 1 deletion.
    28 changes: 27 additions & 1 deletion form-validator.js
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,31 @@
    // shorthand for $(document).ready();
    $(function(){
    //Your code...

    var regexEmail = /.+@.+\..{2,}/
    var regexPassLength = /.{8,}/
    var regexPassCap = /[A-Z]+/
    var regexPassNum = /\d+/
    $('form').on('submit', function(e) {
    e.preventDefault();
    var email = regexEmail.exec(this[0].value);
    var passLength = regexPassLength.exec(this[1].value)
    var passCap = regexPassCap.exec(this[1].value)
    var passNum = regexPassNum.exec(this[1].value)
    console.log(email);
    console.log(passLength);
    console.log(passCap);
    console.log(passNum);
    if ( email === null ) {
    $('#errors').append("<li>Email format invalid</li>");
    };
    if (passLength === null) {
    $('#errors').append("<li>Password needs to be at least 8 characters long</li>");
    };
    if (passCap === null) {
    $('#errors').append("<li>Password needs at least one capital letter</li>");
    };
    if (passNum === null) {
    $('#errors').append("<li>Password needs at least one number</li>");
    };
    });
    });
  2. Kevin Solorio created this gist Aug 2, 2013.
    5 changes: 5 additions & 0 deletions form-validator.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,5 @@
    // shorthand for $(document).ready();
    $(function(){
    //Your code...

    });
    22 changes: 22 additions & 0 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,22 @@
    <!doctype html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="main.css">
    <title>Form Validation</title>
    </head>
    <body>
    <form name="sign_up" action="#" method="post">
    <label for="email">Email</label>
    <input type="text" name="email" />
    <label for="password">Password</label>
    <input type="password" name="password" />

    <button type="submit">Sign Up</button>

    <ul id="errors"></ul>
    </form><body>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="form-validator.js"></script>
    </body>
    </html>
    3 changes: 3 additions & 0 deletions main.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,3 @@
    ul#errors {
    color: red;
    }