I have a simple form that needs validating. I've got it working in FF, but it behaves strangely in IE. I'm using jQuery 1.6 and jQuery Validate 1.8.
Below is the full html code. As you can see I've tried changing the charset attribute, since I read some people had success doing this for IE. Still no luck. The weird thing is that when you run this in IE, the submitHandler gets fired off (the alert gets shown saying the form was 'submitted'). It's as if the validate function never fires off at all, even when the entire form is left blank. Can someone please try this or suggest a solution?
<html>
<head>
<script src="jquery.min.js" type="text/javascript" charset="ISO-8859-1"></script>
<script src="jquery.validate.min.js" type="text/javascript" charset="ISO-8859-1"></script>
<script>
$(document).ready(function() {
var prospectTxErrors = {
prospectName : {
required : "An entry is required in field Prospect.",
rangelength : "Prospect Name must be between 2 and 45 characters."
},
groupSize : {
required : "An entry is required in field Group Size.",
digits : "Numeric data is required in field Group Size."
},
zipCode : {
required : "An entry is required in field Zip Code.",
digits : "Numeric data is required in field Zip Code.",
rangelength : "Zip Code must be 5 digits."
},
sicCode : {
required : "This is an invalid SIC code. Enter the SIC again or search for the SIC code.",
rangelength : "This is an invalid SIC code. Enter the SIC again or search for the SIC code.",
digits : "This is an invalid SIC code. Enter the SIC again or search for the SIC code."
},
agencyProducer : {
required : "An entry is required in the Agent field."
},
phone : {
required : "A 10 digit entry is required for Phone field."
}
};
$.validator.setDefaults({
submitHandler : function() { alert("submitted!"); }
});
$("#prospectForm").validate({
errorLabelContainer : $("#errorDiv ul"),
wrapper : "li",
debug : true,
rules : {
prospectName : {
required : true,
rangelength : [2, 45]
},
groupSize : {
required : true,
digits : true
},
zipCode : {
required : true,
digits : true,
rangelength : [5, 5]
},
sicCode : {
required : true,
rangelength : [4, 4],
digits : true
},
agencyProducer : {
required : true
},
phone : {
required : true,
digits : true
}
},
messages : prospectTxErrors
});
});
</script>
<title>Test Prospect</title>
</head>
<body>
<div id="errorDiv"><ul id="errorList"></ul></div>
<form class="prospectForm" id="prospectForm" method="get" action="">
<label>Prospect Name</label>
<input type="text"
name="prospectName"
id="prospectName"
class=""/>
<br></br>
<label>Group Size</label>
<input type="text"
name="groupSize"
id="groupSize"
class=""/>
<br></br>
<label>Zip Code</label>
<input type="text"
name="zipCode"
id="zipCode"
maxLength="5"
class=""/>
<br></br>
<label>SIC Code</label>
<input type="text"
name="sicCode"
id="sicCode"
maxLength="4"
class=""/>
<br></br>
<label>Agency/Producer</label>
<input type="text"
name="agencyProducer"
id="agencyProducer"
class=""/>
<br></br>
<label>Phone</label>
<input type="text"
name="phone"
id="phone"
class=""/>
<input class="submit" type="submit" value="Submit"/>
</form>
</body>
</html>