Сделать DataTables использовать Ajax HTTP GET, для каждой строки вместо стандартного <a href> link

Question

I am using datatables JQuery плагин с asp.net

Я следующий код, который делает ссылку

 "columns": [ 
     { 
      "data": "Id", "render": function (data) { 
       return '<a class="btn btn-default btn-sm btn-color-primary" href="@(Url.Action(Model.ActionUrl))?id=' + data + '"><i class="glyphicon glyphicon-@(Model.ActionIcon)"></i></a>'; 
      } 
     }, 
      { "data": "Id" }, 
      { "data": "FirstName" }, 
      { "data": "Surname" }, 
      { "data": "Company" } 
     ], 

в DataTable

@Actionurl является url to/Controller/Method с строками Id

@ActionIcon либо Edit, либо Detail

Этот код работает, когда вы нажимаете на значок редактирования, но он отображает совершенно новую страницу. Я хочу скорее сделать вызов ajax, чтобы я мог вернуть модальный диалог с моего сервера.

Вопрос: Как изменить приведенный выше код данных, чтобы вместо этого сделать ajax-вызов на сервер, а не в настоящее время это стандартная ссылка <a href, которая обновляет страницу.

Answer 1

Я не вижу реальной проблемы. Просто замените якорный тег на элемент <span>, инициирующий вызов ajax onclick?

funtion ajax(data) { 
    $.ajax({ 
     url: '@(Url.Action(Model.ActionUrl))?id=' + data, 
     success: function(response) { 
     //do whatever here 
     } 
    }) 
} 

...

render: function (data) { 
    return '<span class="btn btn-default btn-sm btn-color-primary" '+ 
     'onclick="ajax('+data+');"><i class="glyphicon glyphicon-@(Model.ActionIcon)"></i></span>'; 
}