JQuery Ajax, No callback function is run in ASP.NET MVC 5

Question

I'm trying to render a partial view in a container div using JQuery Ajax. Here's my ajax-call:

var href = {
    href: $(this).attr("href").substr(1)
}
var container = $(".customer-main-content-container");
$.ajax({
    url: "@Url.Action(" CustomerMenuSelection ")",
    type: "POST",
    dataType: "html",
    contentType: "application/json",
    data: JSON.stringify(href),
    error: function (jqXHR, textStatus, errorThrown) {
        alert("ERROR: " + errorThrown.text());
    },
    success: function (result) {
        container.empty();
        container.html(result).show();

    }
});

Update

Here's my Action code:

public ActionResult CustomerMenuSelection(string href)
{
    var user = GetCurrentUser();
    var tempSensorTree = _prtgClient.GetPrtgSensorTree(user.TempPrtgGroupId.ToString());
    var tempDevices = tempSensorTree.Sensortree.Nodes.Group.Device;

    return PartialView("_Monitor", tempDevices);
}

I've followed the call through my Action and found that it indeed sends all the correct data back to the view. However, my ajax-call is not running either error- or success-callback and I have no idea why. This is happening when clicking a menu-item, and this same ajax-call works for all other menu-items except this one. I can't find any differences between the pages. No errors are thrown, the data that I populate the view with is correct. My ajax-call just stops.

So in short, why is my callbacks not triggered?

Grateful for any assistance! Thanks in advance Martin Johansson

Answer 1

This issue might be occurring because of dataType you are expecting from server. Try changing it to "html" as you are returning partial view from server.

dataType: "html"