Question

jeasyui网页提供的示例始终在检索数据网格记录时显示样式。这意味着jEasyUi在加载数据网格时应用样式。例如： DataGrid单元格样式链接中的http://jeasyui.com/demo/main/index.php?plugin=DataGrid 如何在编辑模式下应用样式？

<th data-options="field:'qty',width:100, 
   styler:cellStyler, 
   editor: { type:'numberbox', 
   options: 
      { required:'true', precision:2, onChange:onChangeQty }
   }">
Qty</th>

cellStyler仅在加载的数据网格中生效，

function cellStyler(value,row,index){
    alert(value);
    if (value < 30){
        return 'background-color:#ffee00;color:red;';
    }
}

所以我添加了onChange来进行验证

function onChangeQty(newValue, oldValue) 
{
    var qohField = $("#dg-form").datagrid("getEditor", {index:editIndex,field:"qoh"});
    if (eval($(qohField.target).numberbox('getValue')) < eval(newValue)) {
        console.log($(qohField.target).numberbox('getValue'));
    }
}

但是，onChange如何改变单元格背景的样式颜色？

Answer 1

您可以尝试将此代码添加到onChangeQty功能

.....
var dg = $('#dg-form');
var col = dg.datagrid('getColumnOption','qty');
.....

.....
col.styler = function(){
  return 'background-color:#ffee00;color:red;';
};

dg.datagrid('refreshRow',editIndex);

这未经过测试，为了您的更多信息，我找到了其他人的解决方案here

jeasyui在编辑模式下应用CSS样式

1 个答案: