I have a form using jQuery 1.7 and jQuery validation 1.9 (latest each at the time of this post), which works on firefox / chrome / safari, but only partly works on I.E. (8.0 at least, haven’t tested other versions) — not sure what the deal is.
There’s an example here:
http://jsfiddle.net/bulbous/hZn5A/100/
if you click Test, you see that the text input control is validated in all browsers, but the dropdown isn’t validated in i.e. (but is in all the others).
I’m including the full html for the example below also:
<head>
<script src="jquery-1.7.js" type="text/javascript"></script>
<script src="jquery.validate-1.9.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
jQuery.validator.addMethod("notEqual", function(value, element, param) {
return this.optional(element) || value != param;
}, "Please choose some value!");
$('#myForm').validate({
rules: {
text: {
required: true
},
category: {
required: true,
notEqual: "---"
}
},
messages: {
text: {
required: "Text required"
},
category: {
required: "Category required"
}
}
});
});
</script>
<form id="myForm">
<select id="category" name="category">
<option>---</option>
<option>Category 1</option>
<option>Category 2</option>
<option>Category 3</option>
</select>
<input type="text" id="text" name="text" />
<input type="submit" value="Test" />
</form
</body>
</html>
If you give the
<option>tags explicit “value” attributes, it works.It’s not clear to me why it fails in IE7 but not IE8.