ASP.NET MVC 4: cannot modify jQuery Unobtrusive Ajax

Question

Using ASP.NET MVC 4 and NuGet to manage packages.

After upgrading to jQuery 1.9.1 via NuGet, I began getting JavaScript errors regarding the removal of the live() function in jQuery 1.9.x.

I hit F5 to run in debugging mode from VS.NET, go to the login page, and get the following:

Found this StackOverflow answer: https://stackoverflow.com/a/14512797 and made the 4 changes to ~\Scripts\jquery.unobtrusive-ajax.js.

My ~\Scripts\jquery.unobtrusive-ajax.js:

    $(document).on("click", "a[data-ajax=true]", function (evt) {
       ...
    });
    $(document).on("click", "form[data-ajax=true] input[type=image]", function (evt) {
       ...
    });
    $(document).on("click", "form[data-ajax=true] :submit", function (evt) {
       ...
    });
    $(document).on("submit", "form[data-ajax=true]", function (evt) {
       ...
    });

I also physically deleted jquery.unobtrusive-ajax.min.js and used WebGrease 1.3.0 to regenerate it from my updated ~\Scripts\jquery.unobtrusive-ajax.js.

However, for some reason, my changes to not use the .live() function are not sticking. I tried stopping the IIS Express 8.0 Web Site (localhost:63798) under which VS.NET is running the MVC App.

Also tried doing a Build->Clean Solution, Build->Rebuild Solution before hitting F5 to run in debug mode again.

If anyone has experienced this before and has any insight, I would be very grateful. Thank you in advance.

Epicycle

what libraries do you reference in your views? – Whirly

@DaveA On that View, /Scripts/jquery-1.9.1.js, /Scripts/jquery.unobtrusive-ajax.js, /Scripts/jquery.validate.js, /Scripts/jquery.validate.unobtrusive.js – Epicycle

Have you tried clearing your cache or hitting from another browser? Or, using chrome, bring up the developers tools and click on the /Scripts/jquery.unobstrusive-ajax.js (non-minified) to view the source of the file to verify that your changes are being pushed. I think something is holding on to the old copy. – Stringendo

Have using the latest Unobtrusive Ajax package? The latest version (2.0.30116.0) in my MVC4 project uses .on(), not .live() – Provide

@Stringendo Thank you for your suggestion and insight, I appreciate it. I think somehow since I was using NuGet and then updated unobtrusive ajax, NuGet was hanging onto a pure copy. I followed jmoerdyk's answer and it resolved my issue. – Epicycle

Answer 1

The Microsoft jQuery Unobtrusive Ajax package has been fixed in version 2.0.30116.0 to fix this problem. The calls to .live() were changed to use .on().

Try upgrading your NuGet package to get the latest version.

However, the suggestion to use the jQuery Migrate package is a good one to find issues in other plugins or your own code that aren't compatible with the changes in jQuery 1.9+.

Provide

+1 Not having to use the migrate file and finding a solution which works purely by upgrading the Nuget packages is much better and you are totally right off course that for personal code the migrate file is still very useful for upgrading legacy code if required. I will be noting down that February upgrade of the linked library. Very good information. – Dierolf

That resolved my issue. Thank you very much. I went into NuGet and upgraded Microsoft jQuery Unobtrusive Ajax. It's funny, I couldn't find it before, because I didn't know the exact name to search, thanks for sharing that NuGet Gallery link, I did not know such a site (reminded me of Maven Central in Java) existed. – Epicycle

Answer 2

live() has been removed in jQuery 1.9 along with a few other features.

If you need to have support for removed features you need to also add the jQuery migrate file which contains the removed features.

Adding the reference similar to below should include all the features you need:

<script src="http://code.jquery.com/jquery-migrate-1.1.1.js"></script>

The migrate file in debug mode will also add warnings to your console notifying you when you use any removed features. This will help you in slowly replacing them as you go along leading to eventually you being able to remove the migrate file reference, using only jQuery 1.9 and beyond.

See the following jQuery blog posts for all the details on migrating to jQuery 1.9.

• jQuery Core 1.9 Upgrade Guide
• jQuery 1.9 and 2.0 — TL;DR Edition
• jQuery 1.9.1 Released
• jQuery Migrate 1.1.1 Released
• Migrate on GitHub: Migrate older jQuery code to jQuery 1.9+

Dierolf

+1 for a lot of useful refrence links. However, I did already remove .live() manually from jquery.unobtrusive-ajax.js, please see my code snippet. I will try using the jquery-migrate, since for some reason I cannot get my changes to jquery.unobtrusive-ajax.js to stick. – Epicycle

@PhilipTenn: Hopefully the reference to the migrate file will sort it out. The whole idea of the migrate file is to support migration and off course help developer who rely on third party plug-ins/libraries which they can't change directly them selves. I don't know if Nuget has a reference to download the migrate file but if you have issues with Nuget you can always try to remove the Nuget reference to the jQuery files and download the required files manually and include them in your project, including the migrate file. – Dierolf

Thank you so much for your answer. It really helped. I did end up accepting jmoerdyk's answer, but your information and insight was very helpful as well. – Epicycle

@PhilipTenn:you are absolutely right. Updating the nuget package is the right way. I wasn't aware of the February release and will definitely keep note of that myself :) – Dierolf