Cspeisman/form-validator.js

## form-validator.js
// shorthand for $(document).ready();
$(function(){
  $("form[name='sign_up']").submit(validatePassword);

});

function validateEmail(){
  var email = $("[name='email']").val()
  var email_validate = /\w+\@.+\.\w{2,}/
  if (email_validate.test(email) == false ){
    $("ul#errors").append("yo no email, what the fux?");
    return false;
  }
  validatePassword();
}

function validatePassword(){
  numChar = /\d+/
  upcaseChar = /[A-Z]+/
  minChar = /.{8,}/
  password = $("[name='password']").val()

  if (numChar.test(password) == false ){
    $("ul#errors").append("<li>yo you need a numeric character</li>");
  }

  if (upcaseChar.test(password) == false ){
    $("ul#errors").append("<li>yo you need a uppercase character</li>")
  }

  if (minChar.test(password) == false ){
    $("ul#errors").append("<li>yo you need atleast 8 characters</li>")
  }

  if ($("ul#errors").html() != "") return false;
}

## index.html
<!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>

## main.css
ul#errors {
  color: red;
}
	// shorthand for $(document).ready();
	$(function(){
	$("form[name='sign_up']").submit(validatePassword);

	});

	function validateEmail(){
	var email = $("[name='email']").val()
	var email_validate = /\w+\@.+\.\w{2,}/
	if (email_validate.test(email) == false ){
	$("ul#errors").append("yo no email, what the fux?");
	return false;
	}
	validatePassword();
	}

	function validatePassword(){
	numChar = /\d+/
	upcaseChar = /[A-Z]+/
	minChar = /.{8,}/
	password = $("[name='password']").val()

	if (numChar.test(password) == false ){
	$("ul#errors").append("<li>yo you need a numeric character</li>");
	}

	if (upcaseChar.test(password) == false ){
	$("ul#errors").append("<li>yo you need a uppercase character</li>")
	}

	if (minChar.test(password) == false ){
	$("ul#errors").append("<li>yo you need atleast 8 characters</li>")
	}

	if ($("ul#errors").html() != "") return false;
	}
	<!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>