如何為每行Bootstrap-Datatable的列添加錨標記

Question

我有一個頁面，其中某些搜索事件正在刷新數據。

數據由Bootstrap-Datatable wia ajax呈現，並返回json response 。

這是渲染表的小代碼：

function renderTable(url, table, query) {
    $.ajax({url: url,
        data: query,
        success: function(data) {
        $(table).dataTable({
            aaData: data.aaData,
            aoColumns: data.aoColumns,
            bProcessing: true,
            iDisplayLength: 50,
            bDestroy: true
        });
        }
       });
}

我希望所有“ Name列都應該是一個錨標記，並帶有指向具有名稱參數和值的某些url（顯示配置文件）的鏈接。 喜歡-

http://url.com/profile?name=Airi%20satau

Answer 1

我陷入了同樣的情況，即我必須在數據表列中顯示錨標記來代替原始文本。 為我工作的解決方案如下

$(document).ready(function () {
        $('#example').DataTable({
            "ajax": yourDataURL,
            "columns": [ // Defines column for the output table
                    { "data": "InventoryId" }, // Attribute of item in collection
                    { "data": "InventoryName" },
                    { "data": "InventoryManager" },
                    { "data": "InventoryActive1",
                        "orderable": false,
                        "searchable": false,
                        "render": function(data,type,row,meta) { // render event defines the markup of the cell text 
                            var a = '<a><i class="fa fa-edit"></i>  ' + row.InventoryName +'</a>'; // row object contains the row data
                            return a;
                        }
                    }
            ]
        });
    });

希望這對陷入同樣情況的人有所幫助

Answer 2

這是一個古老的問題，但是我在Google上偶然發現了這個問題，所以我認為我應該發布一個答案，以防其他人在這里發生。

根據您的路由，您可以讓jQuery添加一個由名稱修改的click事件。 假設為“ name” td標簽指定了.name類：

  $(".name").click(function() {
        var suffix = $(this).text().split(' ').join('%20'); //replace the space in the name with %20
        window.document.location = "http://url.com/profile?name=" + $(this).text(); //append to the url string and change document location
  });

解決這個問題的技巧是確保它可以與您的路由一起使用，根據示例，路由應該可以。