Question

I have a controller action which renders a partial view:

public ActionResult Details(int id)
{
    DetailsViewModel model = 
        ModelBuilder.GetDetailsViewModel(id, _repository);
    return PartialView("Details", model);
}

and I’m loading the returned content into a dynamic element as follows:

$container = appendContainer(); // adds a div to the dom with the correct id
$container.load("MyController/Details", function(response, status, xhr) {
    if (status != "success") {
        $(container).html('an error has occured');
    }
});

so this creates a div, and then loads the returned content into that div.

I want to alter this slightly so that the container div is only created if the call
to the controller is succesful.

So:

1. jQuery calls the controller action
2. controller returns PartialView, or null if Id not found
3. If PartialView is returned, the container is created and loaded with the returned content.
4. If the controller doesn’t find the Id, no content is created and an alert is displayed.

I’d appreciate any pointers on how I could best acheive this.

Answer 1

All load does is return HTML from a server, so why not just append to a temporary div and then get the HTML from it on success?

var $dummy = $("<div>");
$dummy.load("MyController/Details", function(response, status, xhr) {
    var $container = appendContainer();
    if (status != "success") {
        $container.html('an error has occured');
    }
    else
    {
        $container.html($dummy.html());
    }
    $dummy.remove();
});

UPDATE:

If you’re expecting an exception then you should handle it. If you’re basically allowing the error to occur just to get status != "success" then that’s a serious code smell. You should catch the error and return a different PartialView.

public ActionResult Details(int id)
{
    try
    {
        DetailsViewModel model = 
            ModelBuilder.GetDetailsViewModel(id, _repository);
        return PartialView("Details", model);
    }
    catch (SomeException ex)
    {
        return PartialView("Error", ex.Message);
    }
}

Then you’re guaranteed to always get a valid HTML response and if you don’t, then your basic error an error occured will come into play.