EASYUI的DataGrid满足条件的行更改颜色

[yaotomo]

在中文官网上看到，应该设置rowStyler事件
比如

rowStyler: function (index, row) {
      if(row.value>10){ return   return 'background-color:red;';}
}

这样实现很简单，但是我现在需要数据库中读取上下限，在这个上下限之外时再改变行的颜色，这样就会涉及到ajax请求
这里不能使用异步请求，要使用同步的，但是下面的代码仍然不起任何作用，根本不会跳到判断条件里

 rowStyler: function (index, row) {
            $.ajax({
                url: "../Handler/GetMaterialHandler.ashx",
                type: "POST",
                dataType: "JSON",
                async: false,
                data: { materialid: row.MATERIALID,
                    action: "byid"
                },
                success: function (matdata) {
                    //超出库存设定最大值或低于库存设定最小值
                    if (row.NUMBER > matdata.C_MAXVALUE || row.NUMBER < matdata.C_MINVALUE) {
                       return 'background-color:red;';
                    }
                }
            });
        }

于是我打算在onLoadSuccess事件中实现，下面代码虽然可以跳到判断条件中，但????????地方是给该行设置背景色的，代码不知道如何写

onLoadSuccess: function (data) {
                for (var i = 0; i < data.rows.length; i++) {
                    $.ajax({
                        url: "../Handler/GetMaterialHandler.ashx",
                        type: "GET",
                        dataType: "JSON",
                        async: false,
                        data: { materialid: data.rows[i].MATERIALID,
                            action: "byid"
                        },
                        success: function (matdata) {
                            //超出库存设定最大值或低于库存设定最小值
                            if (data.rows[i].NUMBER > matdata.C_MAXVALUE || data.rows[i].NUMBER < matdata.C_MINVALUE) {
                              //????????  
                              //return 'background-color:red 不起作用
                            }
                        }
                    });


                }
            }

[混QWER]

<th field="CreateAdmin" width="150" formatter="check">XXX function check(v,rec) { if(rec["xx"]>100) { return "<span style='color:#ccc'>" + v + "<span>"; } else { return v; } }

[yaotomo]

引用 1 楼 qwertywhb 的回复:

<th field="CreateAdmin" width="150" formatter="check">XXX function check(v,rec) { if(rec["xx"]>100) { return "<span style='color:#ccc'>" + v + "<span>"; } else { return v; } }

1、值是从数据库读取的，静态判断我知道怎么做，问题是使用ajax行不通 2、我要改变整行的颜色，不是单个字段的

[以专业开发人员为伍]

你的那两种方法，都是同一个意思。如果后边的能写，那么前边的也就能那样设置颜色了。所以你的两个写法都是一样的。 我不用 EasyUI。随便猜测一下： 这个 DataGrid 插件允许动态改变某行数据，从而自动刷新。因此，你的颜色应该是可以基于数据本身的值来变色的，例如在字段中有2个字段分别表示当前行的“库存上限”和“库存下限”，这样在 rowStyler 中就可以根据数据值而设置颜色、而不用ajax 方法。然后在 rowStyler 中，当库存上下限是 undefine 的时候你才需要使用 ajax 去访问数据。在 ajax 回调中，就不需要 return 什么样式，而是更新当前行的数据（这样库存上下限就不是 undefine 了！），这样DataGrid就会自动刷新，再次调用 rowStyle 来刷新正常的颜色。

[yaotomo]

引用 3 楼 sp1234 的回复:

你的那两种方法，都是同一个意思。如果后边的能写，那么前边的也就能那样设置颜色了。所以你的两个写法都是一样的。

谢谢前辈回复 确实我也想过在绑定数据时将库存的上下限也取到，根据这个上下限就很容易做到根据条件改变行的颜色了 但是库存上下限不在库存表里面，要做关联查询，我想尽量使用单个表的数据源 如果实在没办法，只有两个表联合查询了

[以专业开发人员为伍]

引用 4 楼 yaotomo 的回复:

谢谢前辈回复 确实我也想过在绑定数据时将库存的上下限也取到，根据这个上下限就很容易做到根据条件改变行的颜色了 但是库存上下限不在库存表里面，要做关联查询，我想尽量使用单个表的数据源 如果实在没办法，只有两个表联合查询了

晕！ 我根本没有说让你查询初始数据的时候去吧库存上下限的数据“也取到”！你理解我说的流程时，还是不仔细，没有看懂。 我们假设在你毫无必要一开始就费时间去同步初始化库存上下限的值的情况下，当前端发现某一行数据的库存上下限的值是 undefined 的时候才需要使用 ajax 去异步重新填写这个库存上下限，也就是在 rowStyler 中调用 ajax 的 success 部分是刷新这一行数据。 你看懂了吗？

[以专业开发人员为伍]

如果你看不懂流程，只能抄别人写的代码，我就没有办法了。 我没有说让你在一开始初始化数据的时候就要填写好库存上下限的值。我一开始就说“这个 DataGrid 插件允许动态改变某行数据，从而自动刷新”。以及后边的 rowStyler 中让你判断库存上下限是不是“已经有值”，如果有值就直接 return 回最终颜色，如果没有值则通过 ajax 来获取库存上线下限的值并且刷新当前行数据（或者异步地刷新当前行数据）。 如果我让你在数据初始化的时候就填写好库存上下限，怎么可能有这些描述？你此时是一丁点都没有想象空间啊。

[yaotomo]

使用jquery的属性选择器解决了，谢谢各位

                    if (row.NUMBER > matdata.C_MAXVALUE || row.NUMBER < matdata.C_MINVALUE) {
                        $("[datagrid-row-index='" + index + "']").css({ "background-color": "#F08080" });
                        return '';
                    }