-
-
Save Hello-Maja/6454060 to your computer and use it in GitHub Desktop.
Form Validation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // shorthand for $(document).ready(); | |
| $(function(){ | |
| function validateForm(form){ | |
| var email = document.sign_up.email; | |
| var password = document.sign_up.password; | |
| var validEmail = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; | |
| var containsDigit = /\d/; | |
| var containsCap = /[A-Z]/; | |
| var valPassLen = document.sign_up.password.length; | |
| var invalid = []; | |
| if (password.length === 0){invalid.push("Password cannot be blank"); | |
| } | |
| if (password.length < 8){invalid.push("Password must be at least 8 characters long"); | |
| } | |
| if (!containsCap.test(password)){invalid.push("Password must have at least one capital letter"); | |
| } | |
| if (containsDigit.test(password)){invalid.push("Password must have at least one numeric character (0-9)"); | |
| } | |
| if (invalid.length !== 0) { | |
| $("#errors ul").append($('<li>invalid.join("\n")</li>')); | |
| // return false; | |
| } | |
| // return true; | |
| // $('.submit').click(function(){ | |
| // validateForm(); | |
| // }); | |
| } | |
| }); | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <link rel="stylesheet" href="main.css"> | |
| <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> | |
| <script src="form-validator.js"></script> | |
| <script type="text/javascript"> | |
| var validateForm= $('form').serializeArray(); | |
| function get(){ | |
| $.post('jqtest/test',{name: $('form[name="sign_up"] input[password="password"] input[email="email"]').val()}, | |
| function (output){ | |
| $('#errors').html(output).show(); | |
| } | |
| ); | |
| } | |
| </script> | |
| <title>Form Validation</title> | |
| </head> | |
| <body> | |
| <form class="submit" name="sign_up" action="#" onsubmit="return validateForm(this);" 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> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| ul#errors { | |
| color: red; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Greate