Hi! I am totaly new to javascript and would like to know how to do form validations through it.Here is my code:
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<meta name="description" content="" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script>
jQuery(function($){
		   
	// simple jQuery validation script
	$('#login').submit(function(){
		
		var valid = true;
		var errormsg = 'This field is required!';
		var errorcn = 'error';
		
		//match email address
		var emailRegex = /'^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$'/;
		//select integers only
		var intRegex = /[0-9 -()+]+$/;
		//match elements that could contain a phone number
		var phoneNumber = /[0-9-()+]{3,20}/;
		//match date in format yyyy-mm-dd
		var dateyyyymmddRegex = '/^[0-9]{4}\-(0[1-9]|1[012])\-(0[1-9]|[12][0-9]|3[01])/;';

		
		$('.' + errorcn, this).remove();			
		
		$('.required', this).each(function(){
			var parent = $(this).parent();
			if( $(this).val() == '' ){
				var msg = $(this).attr('title');
				msg = (msg != '') ? msg : errormsg;
				$('<span class="'+ errorcn +'">'+ msg +'</span>')
					.appendTo(parent)
					.fadeIn('fast')
					.click(function(){ $(this).remove(); })
				valid = false;
			};
		});
		
		
		$('#login_email', this).each(function(){
			var parent = $(this).parent();
			if( $(this).val() == '' || !this.value.match(emailRegex)){
				var msg = $(this).attr('title');
				msg = (msg != '') ? msg : errormsg;
				$('<span class="'+ errorcn +'">'+ msg +'</span>')
					.appendTo(parent)
					.fadeIn('fast')
					.click(function(){ $(this).remove(); })
				valid = false;
			};
		});
		
		
	
		
		
			$('.phone', this).each(function(){
			var parent = $(this).parent();
			if( $(this).val() == '' || !$(this).val().match(phoneNumber)  || !this.value.match(intRegex)){
				var msg = $(this).attr('title');
				msg = (msg != '') ? msg : errormsg;
				$('<span class="'+ errorcn +'">'+ msg +'</span>')
					.appendTo(parent)
					.fadeIn('fast')
					.click(function(){ $(this).remove(); })
				valid = false;
			};
		});
		
					$('.date', this).each(function(){
			var parent = $(this).parent();
			if( $(this).val() == '' || !$(this).val().match(dateyyyymmddRegex)){
				var msg = $(this).attr('title');
				msg = (msg != '') ? msg : errormsg;
				$('<span class="'+ errorcn +'">'+ msg +'</span>')
					.appendTo(parent)
					.fadeIn('fast')
					.click(function(){ $(this).remove(); })
				valid = false;
			};
		});


		return valid;

	});
	
})	
</script>
<link rel="stylesheet" href="style.css" type="text/css"/>
</head>
<body>
<form id="login" method="post" action=""> 
    <div>
    	<label for="login_username">Username</label> 
    	<input type="text" name="username" id="login_username" class="field required" title="Please provide your username" />
    </div>			

    <div>
    	<label for="login_password">Password</label>
    	<input type="password" name="password" id="login_password" class="field required" title="Password is required" />
    </div>	
        <div>
    	<label for="login_email">Email</label>
    	<input type="text" name="email" id="login_email" class="field email" title="Email is required.Check format" />
    </div>	
            <div>
    	<label for="login_phone">Phone No</label>
    	<input type="text" name="phone" id="login_phone" class="field phone" title="Phone is required.Enter 10 numerics" />
    </div>		
                <div>
    	<label for="login_date">Date yyyy-mm-dd</label>
    	<input type="text" name="date" id="login_date" class="field date" title="Date is required.Enter yyyy-mm-dd format" />
    </div>			
	
   			
    <div class="submit">
        <button type="submit">Log in</button>   
    </div>
</form>	
</body>
</html>
As you can see,function works perfect for the required fields.But other fields error messages are still displayed even the values are correct.Can anyone tell me where I am going wrong?