Question

好的，如果我想根据数据表中复选框的值更改行颜色怎么办？我似乎无法使语法正确。例如，低于数据值[9]不起作用。我已经尝试了1并且无论有没有引号都是真的。并且rowCallback也是。数据[7]无论哪种方式都可以。我确定它是数据[9]复选框值的推导，在此没有看到任何内容。

createdRow: function (row, data, index) {
    if (data[9] == 'checked') {
        $('td', row).css('background-color', 'Red');
    }
    else if (data[7] == '$6') {
        $('td', row).css('background-color', 'Orange');
    }
}

第一篇文章，为格式化道歉

我已经为我发现了这种解决方法，但必须有更好的方法：

      createdRow: function (row, data, index) {
                if (data[9] == '<input checked="checked" class="check-box" disabled="disabled" type="checkbox">') {
                    $('td', row).css('background-color', 'Red');
                }
                else if (data[7] == '$6') {
                    $('td', row).css('background-color', 'Orange');
                }
            }

Answer 1

这个怎么样？

render函数用于获取要显示的值（html），检索数据，排序和过滤。因此，您必须为每个操作返回不同的值（由type属性确定。

现在，在代码段中，检索的值返回值是列的值，而不是显示它的html。 createdRow函数从这些渲染函数中获取数据，因此它不再获取HTML

＆＃13;

$(document).ready( function () {
    $('#myTable').DataTable({
        data: [[5, true], [3, false]],
        columns:[
          {data:0},
          {
            data:1,
            render: function(data, type, row, meta){
                // if type is not "display", it means that we want to sort, filter,
                // or retireve data, so we return the value
                if (type !== "display")
                    return data;
                
                // We return the HTML we want to display now that we are sure
                return `<input class="check-box" ${data?'checked="checked"':''} type="checkbox">` 
            }
          }
        ],
        createdRow: function (row, data, index){
            // Now that we have the data and not the HTML it is cleaner
            if (data[1])
              $('td', row).css('background-color', 'Red');
        }
        
    });
} );

＆＃13;

<link href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>

<table id="myTable">
</table>

＆＃13;

PD。：最好使用JQuery创建一个DOM节点并检查属性＆＃34; disabled＆＃34;比较HTML

Answer 2

使用parseHTML将字符串解析为一个jquery对象，然后检查是否已选中。

createdRow: function (row, data, index) {
    if ($($.parseHTML(data[9])).is(":checked")) {
        $('td', row).css('background-color', 'Red');
    }
    else if (data[7] == '$6') {
        $('td', row).css('background-color', 'Orange');
    }
}

Datables根据复选框值行颜色

2 个答案: