I have the following:
<html>
<head>
</head>
<body>
<div>
<form method="post">
<div id="questions">
<label for="question-6">Name of Course:</label>
<input type="text" name="name_of_course[response]" value="" id="question-6" class="required">
<label class="control-label" for="reporting-year">Reporting Year: </label>
<select name="reporting_year" id="reporting-year">
<option value="-1" selected="selected">Select option...</option>
<option value="4">2013-2014</option>
<option value="1">2012-2013</option>
<option value="2">2011-2012</option>
<option value="3">2010-2011</option>
</select>
</div>
<input type="submit" name="submit" value="Save Entry" class="btn">
</form>
</div>
<script src="//code.jquery.com/jquery.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script>
<script>
$(function(){
jQuery.validator.addMethod("notEqual", function(value, element, param) {
return this.optional(element) || value !== param;
}, "Please select an option");
$('form').validate({
rules:{
'reporting_year': {
notEqual: "-1"
}
}
});
});
</script>
</body>
</html>
Everyone's favorite browser, IE7 (IE10 w/compatibility really) is reporting the following error in the console:
SCRIPT3: Member not found.
jquery.js, line 2525 character 4
Of course IE8 and above work fine, but my client is using IE7.
Looks like it's a bug with IE10 in compatibility mode as it is reported to work in IE7. But there are some jquery workarounds posted here: http://bugs.jquery.com/ticket/12577