Json Url.Action failing in new MVC 5 app

Question

I've made extensive use of return Json(new { url = Url.Action("MyAction", new { param = 1 } in my apps. I recently migrated an MVC 4 app to MVC 5 and it still works but if I build a new MVC app with Visual Studio 2013 update 2 (which templates a MVC 5, EF 6.1 and Identity 2 app) it now fails to redirect and the json is sent to the browser:

Do you want to open or save 23xdf543v.json (28 bytes) from localhost

(To get Identity 2 setup I created a new MVC 5 app and copied all my MVC 4 app files into it and refactored to get it working).

If I open the JSON the url appears to be properly formatted. (in this example the MyAction is in MyController)

{"url":"/MyController/MyAction/1"}.

The odd thing is that it works with a migrated MVC 4 to MVC 5 app but not a newly templated MVC 5 app.

Action:

public ActionResult Phn2Add(PhoneVm vM)
{ 
  if (ModelState.IsValid)
  { 
    _db.Phones.Add(vM.Phone); _db.SaveChanges();
    return Json(new { url = Url.Action("Details", new { id = vM.DetailsId }) });
  }
  ModelState.AddModelError(string.Empty, ErMsInvldEdt);
  PhTyDrpDwn();
  return PartialView("Add_Del/_PhnAdd", vM);
}

View:

@model MyApplicaiton.ViewModels.PhoneVm
@{ ViewBag.Title = "Add"; } 
<script type="text/javascript">
  var onSuccess = function (result) { if (result.url) { window.location.href = result.url; } }
</script>
<div id="PhnAdd">
  <div style="padding-left:17px">
    <h3>Add a @Model.Msg? @Html.ActionLink("CANCEL", null, new { id = Model.DetailsId }) </h3>
  </div>
  @using (Ajax.BeginForm(@Model.ActnNm, new AjaxOptions
    { 
      OnSuccess = "onSuccess", UpdateTargetId = "PhnAdd", HttpMethod = "Post"
    }))
    {  @Html.AntiForgeryToken() @Html.ValidationSummary(true) 
      <fieldset>      <legend></legend><br />
        @Html.HiddenFor(m => m.Phone.PersonId) @Html.HiddenFor(m => m.DetailsId)
        @Html.HiddenFor(m => m.ActnNm) @Html.HiddenFor(m => m.Msg)
        <table>
          <tr>
            <th><span class="editor-label">Number: (7573334444)</span></th>
            <td>
              <span class="editor-field">@Html.EditorFor(m => m.Phone.Number) @Html.ValidationMessageFor(m => m.Phone.Number) </span>
            </td>
          </tr>
          <tr>
            <th><span class="editor-label">Type: Land or Mobile</span></th>
             <td><span class="editor-field">@Html.DropDownList("Phone.Type", (IEnumerable<SelectListItem>)ViewBag._PhTyp)
                                            @Html.ValidationMessageFor(m => m.Phone.Type) </span>
             </td>
          </tr>
        </table>
        <input type="submit" value="Add" />
      </fieldset>
    }
  </div>

Does MVC 5 handle Url.Action differently? Is there some change in javascript's handling of OnSuccess? Is there a setting that needs to be changed?

Answer 1

The Visual Studio 2013, update 2, MVC template doesn't install the jquery.unobstrusive-ajax.js script. I Added it in my BundleConfig but it wasn't installed in the Script folder. Once installed the AjaxOnSuccess started working.

Answer 2

These two scripts were dropped from the templates in VS2013. I've talked to the editor/template team, and we will update here when I get more info on the plan.