时间戳

首页 > 解决方案 > Datatables.js 超链接单元格

javascript - Datatables.js 超链接单元格

问题描述

使用 DataTables.js 并且需要在列中的每个单元格都有一个可点击的 url。现在我正试图让它去google.com。

我正在努力让它工作，在准备好几个教程之后仍然没有接近，我的代码如下；

jQuery(window).load(function () {
jQuery.ajax({
    url: "Requisitions.aspx/GetMyRequisitions",
    method: "POST",
    data: '{"ReqId":"' + reqId + '", "Title": "' + reqTitle + '", "PrimaryHiringManager": "' + reqHiringManager + '", "StartDate": "' + reqStartDate + '", "Status": "' + reqStatus + '", "Applicants": "' + reqApplicants + '"}',
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (data) {
        jQuery('#MyRequisitions').DataTable({
            data: data.d,
            retrieve: true,
            order: [[5, "desc"]],
            responsive: true,

            column:
                [
                    { "data": "ReqId" },
                    {
                        "data": "Title",
                        "render": function (data, type, row, meta) {
                                data = '<a href="https://www.google.com/"></a>';
                            return data;
                        }
                    },
                    { "data": "PrimaryHiringManager" },
                    { "data": "StartDate" },
                    { "data": "Status" },
                    { "data": "Applicants" }
                ]
        });
    }
});

});

标签： javascriptjquerydatatables

解决方案

将值传递给它的超链接

{  
"render": function (data, type, full, meta)  
{ return '<a class="btn btn-info" href="/Demo/Edit/' + full.CustomerID + '">Edit</a>'; }  
}

点击超链接调用函数

{  
data: null, render: function (data, type, row) {  
return "<a href='#' class='btn btn-danger' onclick=DeleteData('" + row.CustomerID + "'); >Delete</a>";  
}  
},

function DeleteData(CustomerID) {  
        if (confirm("Are you sure you want to delete ...?")) {  

        }  
        else {  
            return false;  
        }  
    }

输出

输出

如果您想了解更多详细信息，请点击文章链接

链接到数据表网格示例

推荐阅读