14

我正在使用数据表,并且我有以下代码来生成表。我想显示读取、写入、执行和管理值的复选框。如果该值等于 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"]
] }
4

1 回答 1

23

我能够使用 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"
    });
});
于 2013-01-03T00:08:32.577 回答