Validate plugin nog working in IE8
I have a form using the validation plugin and it's working great in FF and Safari but not in IE8.
Can anyone tell me what's wrong with this code:
- jQuery(document).ready(function($) {
-
- // ajax submit form
- var $form = $("#contact-form");
- var $sending = $("#msg-senging");
- var $success = $("#msg-success");
- var $errormsg = $("#msg-err");
-
- // validate form
- $form.validate({
- onfocusout: false,
- rules: {
- contact_form_name: {
- required: true,
- minlength: 2
- },
- contact_form_email: {
- required: true,
- email: true
- },
- contact_form_message: {
- required: true,
- minlength: 10
- },
- contact_form_phone: {
- minlength: 10
- },
- contact_form_location: {
- minlength: 4
- }
- },
- messages: {
- contact_form_name: {
- required: "Please enter your name",
- minlength: "Your name must consist of at least 2 characters"
- },
- contact_form_phone: "Please provide a valid phone number",
- contact_form_location: "Please provide a valid location",
- contact_form_email: "Please enter a valid email address",
- contact_form_message: {
- required: "Please enter message",
- minlength: "Your message must consist of at least 10 characters"
- }
- },
- errorElement: "em",
- errorPlacement: function(error, element) {
- error.appendTo( element.parent().find(".error-wrapper").eq(0) );
- },
- submitHandler: function() {
- // if valid > then submit
- $form.ajaxSubmit({
- // target identifies the element(s) to update with the server response
- target: success,
-
- beforeSubmit: function() {
- $form.hide();
- $sending.fadeIn('slow').delay(1500);
- },
- // success identifies the function to invoke when the server response
- // has been received; here we apply a fade-in effect to the new content
- success: function(rtn) {
- if(rtn=="Success") {
- $sending.fadeOut('slow', function() {
- $success.fadeIn('slow');
- });
- } else {
- $sending.fadeOut('slow', function() {
- $errormsg.fadeIn('slow');
- });
- }
- }
- });
- }
- });
-
- // default value
- $(".contact-form textarea").defaultValue('Please enter your message here...');
-
- // add .focus class to inputs
- $(".contact-form .input").focus(function() {
- $(this).parent().find("span").addClass('input-focus');
- $(this).addClass('input-focus');
- }).blur(function() {
- $(this).removeClass('input-focus');
- $(this).parent().find("span").removeClass('input-focus');
- });
-
- $(".contact-form .textarea").focus(function() {
- $(this).parent().find("span").addClass("textarea-focus");
- $(this).addClass("textarea-focus");
- }).blur(function() {
- $(this).removeClass("textarea-focus");
- $(this).parent().find("span").removeClass("textarea-focus");
- });
-
- // fadein contact form
- $(".contact-form").delay(100).slideDown('slow');
- });
Also, when I click on the submit button a couple of times, the form keeps repeating my error message.