Question

我有一个DataTables表，其中填充了从Java servlet返回的JSON数据。表格中的每一行都有一个复选框。我有可以向每个复选框添加复选框的代码，但我需要弄清楚如何评估JSON中特定字段的值，如果满足条件，请选中该复选框。我愿意接受任何可行的方法。到目前为止，我一直在尝试实例化表时设置每个复选框的ID属性。我的想法是，我的代码将查看每个复选框的ID值，并仅检查等于特定值的ID。我想知道是否可以将ID属性设置为JSON中特定字段的值。 JSON的缩写版本如下所示。请注意，它包含一个“状态”字段。我想将ID设置为等于状态值。

{"data":[{"date":"20180101","status":"Incomplete","total_files":22,"total_size":16896},{"date":"20180102","status":"Complete","total_files":24,"total_size":19968,"itws":"itws","itws_count":24,"itws_status":"Complete"}]}

这是我的DataTables实例化代码的一个片段。

$(document).ready(function () {
                var table = $('#search_results').DataTable({
                        searching: false,
                        paging: false,
                    "ajax": {
                        url: "http://localhost:8080/FileSearch-1/FileSearch"+servletUrl+"&startDate="+startDateVal+"&endDate="+endDateVal+"&startTime="+startTimeVal+"&endTime="+endTimeVal,
                        method: "GET",
                        xhrFields: {
                            withCredentials: true
                        }  
                    },
                    "columns": [
                        {
                        "className": "details-control",
                        "orderable": "false",
                        "data": "null",
                        "defaultContent": '', 
                        "render": function () {
                            return '<i class="fa fa-plus-square" aria-hidden="true"></i>';
                        },
                        "width":"15px"
                        },
                        { "render": function () {
                                return '<input type="checkbox" id="status" name="oneDay">';
                            }
                        },
                        { "data": "date" },
                        { "data": "status" },
                        { "data": "total_files" },
                        { "data": "total_size" }
                    ],
                    "order": [[1, 'asc']]
                });

是否可以将复选框的ID属性设置为JSON中status字段的值？例如，如果状态字段为“完成”，则复选框的ID将设置为“完成”。我尝试做

之类的事情

return '<input type="checkbox" id="'+status+'" name="oneDay">';

...在这种情况下，表格将正确呈现，但ID的值将保持空白。

return '<input type="checkbox" id="'+data:status+'" name="oneDay">';

...在这种情况下，它根本不会呈现，并且会产生JavaScript错误，指出：是意外令牌。

Answer 1

元素的属性值，无论是名称，Id还是自定义数据属性，都可以设置为JSON中元素的值。这是我的方法。这是我的旧代码。

"render": function () {
                            return '<i class="fa fa-plus-square" aria-hidden="true"></i>';
                        },

新代码包括两个更改。在创建复选框的行上方有一个新行。并且设置属性值的语法已更改。

data: 'status',
                        "render": function (data, type, row) {
                                return '<input type="checkbox" data-status="'+data+'" id="'+data+'" name="oneDay">';
                            }

我根据Louy的建议添加了“ data-status”属性，并将尝试使用该属性代替以后的Id属性。新代码的结果是将Id和data-status属性的值设置为JSON中的“ status”字段的值。

如何在jQuery DataTable中动态设置复选框的ID属性

1 个答案: