在 Bootstrap Table 中设置新行的背景颜色

Setting background color of new rows in Bootstrap Table

我正在使用 Bootstrap TableEditable 插件。我有一个按钮可以将新行添加到 table。我希望 Notes 列中新行的单元格具有蓝色背景色。

来自documentation

function cellStyle(value, row, index, field) {
  return {
    classes: 'text-nowrap another-class',
    css: {"color": "blue", "font-size": "50px"}
  };
}

唯一与这些参数一致并添加新行的是索引= 0,所以我将其他所有默认为Null。似乎我的功能甚至没有被调用。我是 JavaSript 的新手,所以我可能遗漏了一些东西。

http://jsfiddle.net/8gk0ogtp/1/

 $button = $('#button');
    $(function () {
        $button.click(function () {
            $table.bootstrapTable('insertRow', {
                index: 0,
                row: {}
            });
            cellStyle();
        });
    });

function cellStyle1(value=Null, row=Null, index=0, field=Null) {  
   return {css: {"background-color": "blue"}}
}

试试这个

http://jsfiddle.net/bitriddler/qjht8stb/

变化:

添加新行时我添加了paintBlue=true

已更新cellStyle至此

function cellStyle(value=Null, row=Null, index=0, field=Null) {
    if(row.paintBlue) {
        return {css: {"background-color": "blue"}}
    }
    return {};
}

定义列时传递cellStyle函数而不是传入htmldata-cell-style属性

...
{
    field: 'Notes',
    sortable: 'true',
    cellStyle: cellStyle,
    title: 'Notes',
    editable: {
    type: 'textarea'
}
...