Error in jquery.validate.js in MVC 4 Project with jQuery 1.9

I created a new ASP.Net MVC 4 project using the template in Visual Studio 2012. After upgrading to jQuery 1.9, the login functionality breaks. Specifically, I get the error

0x800a138f - JavaScript runtime error: Unable to get property 'call' of undefined or null reference

at line 1172, column 5 in jquery.validate.js

How can I fix this issue?

Solution 1:

This issue is fixed in jQuery Validation Plugin 1.11.0pre.

Unfortunately there is currently no pre-release build on NuGet, so it is currently necessary to download jquery.validation.js directly from GitHub:

jQuery.Validation 1.11 is now available via NuGet (thanks @Simon_Weaver).

UPDATE

It looks like general support for jQuery 1.9 is in the jQuery.Validation code base but not yet released

https://github.com/jzaefferer/jquery-validation/pull/613

Solution 2:

If you install jQuery.Migrate 1.1.1 then it will work fine with jQuery.Validation 1.11, jQuery 1.9 and 2.x.

As well as doing install-package jQuery.Migrate, you must then add the JavaScript to BundleConfig.cs - I added it just after jQuery and this is what the line that registers jQuery looks like now:

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
  "~/Scripts/jquery-{version}.js",           // jQuery itself
  "~/Scripts/jquery-migrate-{version}.js")); // jQuery migrate

Solution 3:

The issue is the line of code inside of the validation script

$.event.handle.call(this,e);

The problem here is with $.event.handle. Both this and e have proper values. jQuery deprecated $.event.handle in favor of jQuery.event.dispatch according to the migration script http://code.jquery.com/jquery-migrate-1.2.0.js.

Fixing these errors is as easy as simply replacing the reference to handle with dispatch.

This can be wrapped in a document.ready callback to ensure it runs after the other scripts run.

$(function(){
    jQuery.event.handle = jQuery.event.dispatch
});