在 jquery datatables.net 中呈现布尔数据列的最佳方法

Posted 2023-02-22

【中文标题】在 jquery datatables.net 中呈现布尔数据列的最佳方法

【英文标题】：Best way to render boolean data columns in jquery datatables.net

【发布时间】：2015-02-01 06:35:59

【问题描述】：

我将datatables.net 数据网格与jquery 和bootstrap 一起使用。我有大量的 JSON 数据，其中包含一些布尔列，并且希望将数据表列呈现为选中或未选中的复选框（当然都具有引导样式）。这样做最简单/最快的是什么？

【参考方案1】：

我回答了我自己的问题 :-) 其实很简单：

var simple_checkbox = function ( data, type, full, meta ) 
    var is_checked = data == true ? "checked" : "";
    return '<input type="checkbox" class="checkbox" ' +
        is_checked + ' />';


var setup_datatable = function () 
    $('#data-table').DataTable(
        "columns": [
             "data": "id", "className": "text-center",
             "data": "keywords",
             "data": "platform",
             "data": "is_active", "render": simple_checkbox,
             "data": "is_terminated", "render": simple_checkbox
        ],
        "ajax": "/data"
    ); // DataTable

【讨论】：

这很棒。我认为您应该接受自己的答案，也许它会在将来对其他人有所帮助。

这个答案仍然有效，但我刚刚看到它禁用了数据表的排序功能。我想指出this other answer 作为可以很容易集成的补充。

【参考方案2】：

添加禁用的类将删除页面上的功能但保持外观。

var simple_checkbox = function (data, type, full, meta) 
             var is_checked = data == true ? "checked" : "";
             return '<input type="checkbox" **class="checkbox disabled"** ' +
                 is_checked + ' />';
         

【讨论】：

谢谢@eric phillips，这是个好主意

这非常有用！我很高兴看到我的复选框出现了检查。奇怪的是，当一个复选框被选中时，它不再显示任何内容，直到我移动到另一个区域然后它才会呈现。你遇到过吗？

@Robin。是什么导致了你，你是如何解决的？