使数据表每行使用 ajax HTTP GET 而不是标准 <a href> link

Question

我正在使用 datatables jquery 插件和 asp.net

我有以下代码呈现 link

        "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" }
        ],

在数据表中

@Actionurl 是 url 到 /Controller/Method 行 Id

@ActionIcon 是 Edit 或 Detail

此代码在您单击编辑图标时有效，但它会呈现一个全新的页面。我宁愿打一个 ajax 电话，这样我就可以 return 从我的服务器上一个模态对话框。

问题：我如何更改上面的数据表代码，而不是对服务器进行 ajax 调用，而不是目前它只是一个标准的 <a href link 来刷新页面。

Answer 1

我没有看到真正的问题。只需将锚标记替换为触发 ajax 调用 onclick 的 <span> 元素？

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>';
}

使数据表每行使用 ajax HTTP GET 而不是标准 <a href> link

Make datatables use ajax HTTP GETs per row instead of standard <a href> link

jquery

datatables

datatables-1.10