[jQuery] validate - error in IE6
I am trying to run my page with the Validator code but on loading it
in IE6 I get the "Expected ;" error followed by "Object doesn't
support this property or method" errors. It has absolutely no problems
in Firefox3. Strangely enough when I comment out the <META http-
equiv="Content-Type" content="text/html; charset=UTF-8"> line the
"Expected ;" error disappears although the validation still does not
work. Here's my page:
-----------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>test</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.validate.pack.js"></script>
<script id="demo" type="text/javascript">
$(function() {
<!-- form validation -->
$('#frmFilterEvents').validate({
rules: {
txtStartDate: {
//sutterdate: true,
required: "#txtEndDate:filled"
},
txtEndDate: {
//sutterdate: true,
required: "#txtStartDate:filled"
},
txtZip: {
minlength: 5,
maxlength: 5
}
},
messages: {
txtStartDate: "mm/dd/yyyy required",
txtEndDate: "mm/dd/yyyy required",
txtZip: "Zip is 5 digits"
},
errorPlacement: function(error, element) {
if ( element.is(":radio") )
error.appendTo( element.parent().next().next() );
else if ( element.is(":checkbox") )
error.appendTo ( element.next() );
else
error.appendTo( element.parent() );
}
});
$('button[name=submitFilter]').click(function() {
return $('#frmFilterEvents').valid();
});
})
</script>
</head>
<body style="margin:0;background-color:#FFFFFF;" class="mls_member
tpl-3col">
<div class="mls_sidebar" id="mls_left">
<div class="mls_navSub mls mls_colLf">
<dl>
<dt>Filter Events</dt>
<dd>
<form action="" id="frmFilterEvents" method="post">
<fieldset>
<legend>Dates</legend>
<ol class="mls_dates">
<li>
<label for="txtStartDate">From</label>
<span class="ui-datepicker-wrap">
<input class="mls_text datePick" type="text"
name="txtStartDate" id="txtStartDate" value="">
</span> </li>
<li>
<label for="txtEndDate">To</label>
<span class="ui-datepicker-wrap">
<input class="mls_text datePick" type="text"
name="txtEndDate" id="txtEndDate" value="">
</span> </li>
</ol>
</fieldset>
<fieldset class="mls_last">
<legend>Location</legend>
<ol>
<li>
<label for="selMiles">Within</label>
<select name="selMiles" id="selMiles">
<option value="10">10 Miles</option>
<option value="20">20 Miles</option>
<option value="50">50 Miles</option>
</select>
</li>
<li>
<label for="txtZip">of Zip Code</label>
<input class="mls_textSmall" type="text"
name="txtZip" id="txtZip" value="">
</li>
</ol>
</fieldset>
<div class="mls_buttons">
<button name="submitFilter" class=""
type="submit">Search</button>
</div>
</form>
</dd>
</dl>
</div>
</div>
</body>
</html>
-----------------------------
Any idea what's wrong?
Thanks.