4

Okay, I've reproduced the problem in JSFiddle. The following form works in Chrome and IE9, but not IE7 or IE8. I've found some rumblings referring to specific versions of jQuery; we are using 1.4.4. Here's the link to the fiddle:

http://jsfiddle.net/xtkuV/77/

The Form

<form action="" id="step1Form" method="post">
<label for="FirstName">FirstName</label>
<input class="text-box single-line" data-val="true" data-val-required="The FirstName field is required." id="FirstName" name="FirstName" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="FirstName" data-valmsg-replace="true"></span>
<br/>

<label for="LastName">LastName</label>
<input class="text-box single-line" data-val="true" data-val-length="The field LastName must be a string with a maximum length of 60." data-val-length-max="60" data-val-required="The LastName field is required." id="LastName" name="LastName" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="LastName" data-valmsg-replace="true"></span>
<br />

<label for="Age">Age</label>
<input class="text-box single-line" data-val="true" data-val-number="The field Age must be a number." data-val-range="The field Age must be between 1 and 130." data-val-range-max="130" data-val-range-min="1" data-val-required="The Age field is required." id="Age" name="Age" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="Age" data-valmsg-replace="true"></span>
    <br/>
    <input type="submit" value="Submit"/>
</form>

The Javascript

$(function(){    
    $('#step1Form').live('submit',function(e){
        e.preventDefault();
        console.log('sup');
        //do an ajax request here or something!
    });
});
Dusda
  • 3,347
  • 5
  • 37
  • 58
  • Version 1.4.4 is pretty old. There were event bubbling problems in old versions of IE; also, setting up a "live" handler on a `
    ` for a "submit" event kind-of makes no sense; just set up a regular event handler.
     – Pointy May 02 '12 at 22:44
  • Okay, but here's a copy of the same proof that uses 1.7.2 and a direct submit handler. Same behavior in IE7 and IE8. http://jsfiddle.net/xtkuV/81/ – Dusda May 02 '12 at 22:48
  • Change "live" to "bind" and see what happens. (Also change "console.log" to "alert".) [updated fiddle, works for me in IE7 (I get the alert)](http://jsfiddle.net/xtkuV/82/) – Pointy May 02 '12 at 22:51
  • oh wait maybe not - that was Firefox I tried :-) Give me a sec ... *edit* no it seems fine in IE7; I get the alert when I click the "submit" button. – Pointy May 02 '12 at 23:00
  • Isn't it supposed to prevent the submit event from bubbling if the form is invalid, though? I'm missing something here. – Dusda May 02 '12 at 23:18
  • The "submit" event is only generated for the `
    ` elements themselves, not the `` elements. If you want to have validation happen and have things stop before you get to the form element "submit" handler, you'd have to detect the validation failure elsewhere.
     – Pointy May 02 '12 at 23:19

1 Answers1

2

"One of the first things you might want to do is update the jquery version to the latest version, which today is version 1.9

After doing this, your client side validation will stop working in Internet Explorer 7 and Internet Explorer 8.

This is because the jquery.validate version is not compatible with jquery versions > 1.6. The solutions is simple, you need to update your version of jquery.validate as well. You can find the current version 1.9 from Microsoft’s CDN. "*

* Above information is taken from this site:

  • I have followings. But still it does not work `jQuery - 2.0.3, jQuery.Validation - 1.11.1, Microsoft.jQuery.Unobtrusive.Validation - 3.0.0` – shashwat Dec 09 '13 at 11:50
  • I could make it working with jQuery 1.11.1 (latest 1.x version) and jQuery.Validation 1.10.0. Details see: http://stackoverflow.com/questions/14818363/mvc3-unobtrusive-validation-not-working-in-ie/26022153#26022153 – firepol Sep 24 '14 at 16:45