MVC unobtrusive AJAX, returning Json data, and IE

Question

So there are lots of questions out there about this whole "IE opens a download file dialog for Json data returned via Ajax" (like this one or this one), but I have not found any answers for those who use Unobtrusive Ajax.

We do a simple Ajax.BeginForm like this:

Ajax.BeginForm("Login", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, 
    new AjaxOptions { UpdateTargetId = "ContentContainer", OnSuccess = "JsonCheckRedirect" }, 
    new { id = "form1" }
)

This posts the form with Content Type of "application/x-www-form-urlencoded; charset=UTF-8". The Controller processes the form, and if there is an error, it returns a PartialView with Content Type "text/html", and that HTML gets put into the ContentContainer (because of the "UpdateTargetId" property in the AjaxOptions).

If there is no error, and the user logged in successfully, it returns Json with the URL they should be redirected to. So in the Controller, it's just simply this:

return Json(new { Url = returnUrl });

Except that we just had a user notify us that in IE8, this is causing the download dialog to pop up. After reading all these other questions with the same issue, I understand why this is happening, but the fix for those situations is to use this Json return instead:

return Json(new { Url = returnUrl }, "text/html");

The problem is that when I return like this, I guess Unobtrusive Ajax sees that the response from the server is HTML, and it replaces the content in the UpdateTargetId container. It does not do this when the server responds with "application/json".

Is there any way around this?

(do I need to explain anything further?)

Answer 1

If you return the url like that, you are going to need to override the Success handler and check the result to see if it has the Url property and then putting the result into window.location.

Personally, rather than returning a new Json result, I would send back a 302 which should make the ajax handler redirect you.

This happens in the bowels of jQuery if memory serves, so you don't need to change anything.

So rather than returning that json result on a successful login, try using a redirectToRoute result instead and send them to the page you want them to go to.