Ad

Datatable : Click On Button Does Not Open View

I have a datatable which displays overview data correctly. I added a button which should go to my controller and from there open a new view displaying the details of the selected row.

The click works, I arrive at the method on my controller. But my details view doesn't open.

This is my javascript:

$("#search-logs tbody").on('click', 'button', function () {
    var self = this;
    var tr = $(self).closest('tr');
    var dtRow = datatable.row(tr[0]);
    var rowData = dtRow.data();
    var processId = rowData[0];

    $.get("@Url.Action("Details","Logs")", { id: processId });
});

And this is the code in my controller:

[HttpGet]
public ActionResult Details(int id)
{
    return View();
}

Can anyone tell me what I am doing wrong?

Ad

Answer

The problem with your code is that you are calling an ajax get function, that is returning a View, instead of a simple HTTP response. To render this view, you need to redirect your page to that url, instead of doing an ajax request.

$("#search-logs tbody").on('click', 'button', function () {
    var self = this;
    var tr = $(self).closest('tr');
    var dtRow = datatable.row(tr[0]);
    var rowData = dtRow.data();
    var processId = rowData[0];

    location.href = '@Url.Action("Details","Logs")?id='+ processId;
});

Also if you still want to use get request, mostly to check if the id exists as it can return 404 Not found, you can the ajax function like this,

$("#search-logs tbody").on('click', 'button', function () {
    var self = this;
    var tr = $(self).closest('tr');
    var dtRow = datatable.row(tr[0]);
    var rowData = dtRow.data();
    var processId = rowData[0];

    $.get("@Url.Action("Details","Logs")", { id: processId }, 

    function(data, statusText, xhr){
     if(xhr.status == 200) location.href = '@Url.Action("Details","Logs")?id='+ processId;
    else alert('Sorry, this id does not exist');
    });
});
Ad
source: stackoverflow.com
Ad