Ale1/form-validator.js

## form-validator.js

$(function(){

// VALIDATION TESTS:

function test_email(input_email){ return input_email.match(/.+@.+\..{2,3}/)};

function test_pass_num(input_password){return input_password.match(/\d/)};

function test_pass_caps(input_password){return input_password.match(/[A-Z]+/)};


// FORM VALIDATION:
$('form').on('submit',function(e){
  e.preventDefault();

  $('#errors').html('') //clears previous attempt errors
  var validates = true
  var email = $("input[name='email']").val();
  var password = $("input[name='password']").val();


  console.log("email inside main test: " + email);
  console.log("password inside main test: " + password);

  if (test_email(email))
    {console.log('email validation passed')}
    else {
      $('#errors').append("<li>'invalid email format'</li>");
      validates = false
    };

   if (test_pass_num(password)){}
    else {
      $('#errors').append("<li>password must contain a number</li>");
      validates = false;
    };


   if (password.length > 7){}
    else {
      $('#errors').append("<li>password must be at least 8 chars long</li>");
      validates = false;
    };

  if (test_pass_caps(password)){}
    else {
      $('#errors').append("<li>password contains one caps</li>");
      validates = false
    };

  if (validates) {
    $("input[name='sign_up']").submit()
    $('#errors').append("<li id='ok'>FORM SUBMITTED SUCCESFULLY</li>");

  };

  })

});

## 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;
}

li#ok {
  color:green;
}

	$(function(){

	// VALIDATION TESTS:

	function test_email(input_email){ return input_email.match(/.+@.+\..{2,3}/)};

	function test_pass_num(input_password){return input_password.match(/\d/)};

	function test_pass_caps(input_password){return input_password.match(/[A-Z]+/)};


	// FORM VALIDATION:
	$('form').on('submit',function(e){
	e.preventDefault();

	$('#errors').html('') //clears previous attempt errors
	var validates = true
	var email = $("input[name='email']").val();
	var password = $("input[name='password']").val();


	console.log("email inside main test: " + email);
	console.log("password inside main test: " + password);

	if (test_email(email))
	{console.log('email validation passed')}
	else {
	$('#errors').append("<li>'invalid email format'</li>");
	validates = false
	};

	if (test_pass_num(password)){}
	else {
	$('#errors').append("<li>password must contain a number</li>");
	validates = false;
	};


	if (password.length > 7){}
	else {
	$('#errors').append("<li>password must be at least 8 chars long</li>");
	validates = false;
	};

	if (test_pass_caps(password)){}
	else {
	$('#errors').append("<li>password contains one caps</li>");
	validates = false
	};

	if (validates) {
	$("input[name='sign_up']").submit()
	$('#errors').append("<li id='ok'>FORM SUBMITTED SUCCESFULLY</li>");

	};

	})

	});
	<!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>