combine javascript and jquery

i am trying to combine jquery and javascript alert together, getting an error, pl take a look.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script>
<script>
$(document).ready(function(){
	  $("#aForm").validate({

				$("#DOB").rules("add", {
                    required: true,
                    date: true,
                    messages: {
                        required: "Date of Birth is required",
                        date: "Date format is incorrect"
                    }
                });
		;
});
/* Date validateion
   Copyright (c) 2003-2010 Michel Plungjan "javascripts(a)plungjan.name" */
function dateVal(aForm) {
  alert('date val working');
  var dateString = aForm.DOB.value;
  if (!dateString || dateString.indexOf('/')==-1) {
    alert('Please enter a valid date on the format mm/dd/yyyy')
    return false
  }

  var date = new Date(dateString);
  var testDate = dateString.split('/');
  var mm = parseInt(testDate[0],10);
  var dd = parseInt(testDate[1],10);
  var yyyy=parseInt(testDate[2],10); // assuming 4 digits
  if (
  date.getMonth()   !=(mm-1) || 
  date.getDate()    !=dd ||
  date.getFullYear()!= yyyy
  ) 
  { 
  	 alert('wrong date');
     return false
  }

  return true
}  
</script> 
</head>
<body>
<form id="aForm" method="get" action="">
	<table width="800" cellpadding="2" cellspacing="0">  
			<tr>
				<td class="label">
					Date
				</td>
				<td>
					<input type="text" id="DOB" size="15" />
				</td>
			</tr>
			
			<tr>
				<td>
				</td>
				<td>
					<input class="submit" type="submit" value="Submit"/> 
				</td>
			</tr> 
	</table>    
</form>
</body>
</html>

Open in new window

yingwhoAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

ZylochCommented:
The jQuery portion of the code should be as below. You are also currently not using the dateVal() function, and indeed it seems redundant if you are going to be using the jQuery validation plugin.

$(document).ready(function(){
   $("#aForm").validate();
   $("#DOB").rules("add", {
      required: true,
      date: true,
      messages: {
         required: "Date of Birth is required",
         date: "Date format is incorrect"
      }
   });
});

Open in new window

0
yingwhoAuthor Commented:
hi zyl, i need to use both as jquery cannot validate the date format. after jquery does the validation reg js should do the validation for proper format.
0
ZylochCommented:
Check the documentation for the validation plugin at http://docs.jquery.com/Plugins/Validation/validate#toptions.

One option you can use is to attach a callback to submitHandler.
0
The Ultimate Tool Kit for Technolgy Solution Provi

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy for valuable how-to assets including sample agreements, checklists, flowcharts, and more!

yingwhoAuthor Commented:
tried .. pl check whats the syntax issue.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script>
<script>
$(document).ready(function(){
   $("#aForm").validate({

   $("#DOB").rules("add", {
      required: true,
      date: true,
      messages: {
         required: "Date of Birth is required",
         date: "Date format is incorrect",
		 submitHandler: dateVal;
      }
   });
});
});
/* Date validateion
   Copyright (c) 2003-2010 Michel Plungjan "javascripts(a)plungjan.name" */
function dateVal() {
  alert('date val working');
  var dateString = aForm.DOB.value;
  if (!dateString || dateString.indexOf('/')==-1) {
    alert('Please enter a valid date on the format mm/dd/yyyy')
    return false
  }

  var date = new Date(dateString);
  var testDate = dateString.split('/');
  var mm = parseInt(testDate[0],10);
  var dd = parseInt(testDate[1],10);
  var yyyy=parseInt(testDate[2],10); // assuming 4 digits
  if (
  date.getMonth()   !=(mm-1) || 
  date.getDate()    !=dd ||
  date.getFullYear()!= yyyy
  ) 
  { 
  	 alert('wrong date');
     return false
  }

  return true
}  
</script> 
</head>
<body>
<form id="aForm" method="get" action="">
	<table width="800" cellpadding="2" cellspacing="0">  
			<tr>
				<td class="label">
					Date
				</td>
				<td>
					<input type="text" id="DOB" size="15" />
				</td>
			</tr>
			
			<tr>
				<td>
				</td>
				<td>
					<input class="submit" type="submit" value="Submit"/> 
				</td>
			</tr> 
	</table>    
</form>
</body>
</html>

Open in new window

0
ZylochCommented:
Try the attached code. If you have any questions as to how it works, feel free to ask. It should also demonstrate why your syntax before was wrong; you shouldn't be wrapping everything inside validate().

$(document).ready(function(){
   $("#aForm").validate({
       submitHandler: function(frm) {
          return dateVal(frm);
       }  
   });
   $("#DOB").rules("add", {
      required: true,
      date: true,
      messages: {
         required: "Date of Birth is required",
         date: "Date format is incorrect"
      }
   });
});

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
yingwhoAuthor Commented:
thanks
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
jQuery

From novice to tech pro — start learning today.