ASP.NET MVC: Redirecting errors in partial to main view

Question

I have a partial that I refresh via Ajax.

View Javascript:

$("#SelectedId").change(function () {
  var id = $("#SelectedId").val();
  if (id > 0) {
    $.ajax({
      url: "/Home/Refresh",
      data: { id: id },
      type: "POST",
      success: function (result) {
        $('#partialHolder').html(result);
      }
    });
  }
});

Refresh action:

[HttpPost]
public ActionResult Refresh(int id)
{
    HomeViewModel model = new HomeViewModel();
    model.id = id;

    ViewBag.id = model.id;
    PrepareModel(ref model);
    return PartialView("~/Views/PartialView.cshtml", model);
}

This works well, except that when an error (such as an HTTP exception) occurs, the error view is sent to the partial when I want it to be shown as the main view.

Error action:

public ActionResult Error(string message)
{
  ViewBag.Message = message;
  return View();
}

I have tried using Javascript (both in the view and returned by the controller) to redirect the browser, however both are buggy and I assume bad practice.

See: http://stackoverflow.com/questions/2261617/how-to-handle-model-state-errors-in-ajax-invoked-controller-action-that-returns — ScottE, Nov 04 '14 at 14:49

score 0 · Answer 1 · answered Nov 04 '14 at 14:51

0

Try as

$("#SelectedId").change(function () {
  var id = $("#SelectedId").val();
  if (id > 0) {
    $.ajax({
      url: "/Home/Refresh",
      data: { id: id },
      type: "POST",
      success: function (result) {
        $('#partialHolder').html(result);
      },
      error: function(result){
      //call new action
      }
    });
  }
});

answered Nov 04 '14 at 14:51

Amit

15,217
8
46
68

The exception in question doesn't seem to affect the return of the partial, only some of the data within it - so the error block is never run. – Oli Walker Nov 04 '14 at 15:33

score 0 · Answer 2 · edited May 23 '17 at 12:13

0

Assuming Error() returns a complete view (with layout and script/css), you could always try completely overwriting your document:

success: function (result) {
   $('#partialHolder').html(result);
},
error: function(xhr) {
   if(xhr.responseText) {
      var newDoc = document.open("text/html", "replace");
      newDoc.write(xhr.responseText);
      newDoc.close();
   }
}

This will effectively overwrite your entire dom and will cause you to lose everything that was on the page.

Credits for document rewrite to this answer

edited May 23 '17 at 12:13

Community

1
1

answered Nov 04 '14 at 15:04

Kippie

3,760
3
23
38

As with Amit - for some reason the error block doesn't run, even when the exception is thrown. – Oli Walker Nov 04 '14 at 15:34
@OliWalker What is being returned from your server? Which http status code does it return? – Kippie Nov 04 '14 at 15:36
The partial view is being returned, but a call within it isn't succeeding and causing the error. This will be fixed soon but I want to make sure any future errors are shown in the main view. – Oli Walker Nov 04 '14 at 15:46

score 0 · Answer 3 · answered Nov 04 '14 at 15:57

Try something like this

in your action

[HttpPost]
public ActionResult Refresh(int id)
{
    try
    {
       HomeViewModel model = new HomeViewModel();
       model.id = id;

       ViewBag.id = model.id;
       PrepareModel(ref model);
       return PartialView("~/Views/PartialView.cshtml", model);
   }
   catch
   {
      return PartialView("~/Views/PartialView.cshtml", null);
   }
}

so in your ajax success

if (result != null) {
   //do your stuff
} else {
    // the controller action returned a partial
    $('#divInYourMain').html("Error 123");
}

Unfortunately this doesn't work either. I don't see how returning a partial with a null model would make `result == null` true? — Oli Walker, Nov 04 '14 at 17:18

score 0 · Accepted Answer · edited May 23 '17 at 10:25

I managed to solve this in a similar way to theLaw's answer, by using a try/catch block and the Content helper method to return a simple string which triggers a redirect.

Refresh Action:

[HttpPost]
public ActionResult Refresh(int id)
{
    try
    {
        HomeViewModel model = new HomeViewModel();
        model.id = id;

        ViewBag.id = model.id;
        PrepareModel(ref model);
        return PartialView("~/Views/PartialView.cshtml", model);
    }
    catch
    {
        return Content("error");
    }
}

View Javascript:

$("#SelectedId").change(function () {
  var id = $("#SelectedId").val();
  if (id > 0) {
    $.ajax({
      url: "/Home/Refresh",
      data: { id: id },
      type: "POST",
      success: function (result) {
        if (result == "error") {
            location.replace("@Url.Action("General", "Error")");
        }
        else {
            ('#partialHolder').html(result);
        }
      }
    });
  }
});

ASP.NET MVC: Redirecting errors in partial to main view

4 Answers4