如何显示jquery.datatables复选框?(How to show checkboxes i

2019-08-05 08:53发布

我使用的数据表,我有以下代码生成表。 我想对阅读的显示屏复选框,写,执行和管理的值。 如果该值等于1,我要进行检查的复选框。 如果0复选框选中。

使用Javascript

<script type="text/javascript" charset="utf-8">
            $(document).ready(function() {
                var oTable = $('#example').dataTable( {
                     "sScrollY": "500px",                                
                    "bPaginate": false,
                    "bProcessing": true,
                    "sAjaxSource": "sources/sample.json"
                } );


            } );
        </script>

HTML

<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
                    <thead>
                        <tr>
                            <th width="20%">Browser</th>
                            <th width="25%">Read</th>
                            <th width="25%">Write</th>
                            <th width="15%">Execute</th>
                            <th width="15%">Admin</th>
                        </tr>
                    </thead>
                    <tbody>

                    </tbody>
                    </table>

JSON

{ "aaData": [
    ["Trident","0","0","0","1"],
    ["Trident","0","1","0","0"],
    ["Trident","0","0","1","1"],
    ["Trident","0","0","1","1"],
    ["Trident","0","0","1","1"],
    ["Trident","0","0","0","0"],
    ["Gecko","1","1","1","1"],
    ["Gecko","0","0","0","1"],
    ["Other browsers","1","0","0","U"]
] }

Answer 1:

我能得到它使用datables mrenderer工作

$(document).ready(function () {
    var oTable = $('#example').dataTable({
        "aoColumnDefs": [{
            "aTargets": [0],
            //"mData": "download_link",
            "mRender": function (data, type, full) {
                if (data == "Gecko") {
                    return '<a href="' + data + '">' + data + ' Download Gecko</a>';
                } else {
                    return '<a href="' + data + '">' + data + ' Download</a>';
                }
            }
        }, {
            "aTargets": [1],
            //"mData": "download_link",
            "mRender": function (data, type, full) {
                if (data == "1") {
                    return '<input type=\"checkbox\" checked value="' + data + '">';
                } else {
                    return '<input type=\"checkbox\" value="' + data + '">';
                }
            }
        }, {
            "aTargets": [2],
            //"mData": "download_link",
            "mRender": function (data, type, full) {
                if (data == "1") {
                    return '<input type=\"checkbox\" checked value="' + data + '">';
                } else {
                    return '<input type=\"checkbox\" value="' + data + '">';
                }
            }
        }, {
            "aTargets": [3],
            //"mData": "download_link",
            "mRender": function (data, type, full) {
                if (data == "1") {
                    return '<input type=\"checkbox\" checked value="' + data + '">';
                } else {
                    return '<input type=\"checkbox\" value="' + data + '">';
                }
            }
        }, {
            "aTargets": [4],
            //"mData": "download_link",
            "mRender": function (data, type, full) {
                if (data == "1") {
                    return '<input type=\"checkbox\" checked value="' + data + '">';
                } else {
                    return '<input type=\"checkbox\" value="' + data + '">';
                }
            }
        }],
        "bFilter": false,
        "sScrollY": "500px",
        "bPaginate": false,
        "bProcessing": true,
        "sAjaxSource": "sources/sample.json"
    });
});


文章来源: How to show checkboxes in jquery.datatables?