天天看点

FineUI用JS的方法将Grid的某一行变色

最近在做项目的时候,想要在FineUI里面将某一行数据变红,使用Demo里面Css的方法并不行(可能是我们公司对FineUI做了加工,导致有些方法不能用),因此只能自己写JS去实现某一行变红的需求。

<script>
 var gridClientID = '<%= grdMain1.ClientID %>';
///遍历grid的每一行的rank和CHANGETOREST的列,根据这两列进行判断是否需要变色
function selectGrid() {
            window.setTimeout(function () {
                var grid = F(gridClientID);
                var store = grid.getStore();
                var len = store.getCount();
                for (var i = 0; i < len; i++) {
                    var rankid = store.getAt(i).get('RANK');
                    var changetorest = store.getAt(i).get('CHANGETOREST');
                    changeColor(rankid, changetorest, i);
                }
            }, 100);
        }
    </script>
           
function changeColor(rankid, changetorest, rowIdx) {
            $.ajax({
                type: "Post",
                url: "OvertimeBatchFormFrm_Crcement.aspx/CheckColor_Blur",
                data: "{'rankid':'" + rankid + "','changetorest':'" + changetorest + "'}",
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    var bcolor = data.d;
                    highlightRows(rowIdx, bcolor);
                },
                error: function (err) {
                    F.alert(err);

                }
            });
        }
           

///以上是通过Ajax 的方法前台调用后台的方法,并将后台的方法的值返回到前台

function highlightRows(item, bcolor) {
            // 增加延迟,等待HiddenField更新完毕
            var grid = F(gridClientID);///F是FineUI的命名空间,Webconfig中设定的
            var row = grid.getView().getNode(item);
            var childNodes = row.childNodes;
            for (var i = 0; i < childNodes.length; i++) {
                var tdDiv = childNodes[i].childNodes[0];///注意是childNodes[i].childNodes[0]
                if (bcolor == "0") {
                    tdDiv.style.backgroundColor = "#FF4343";
                }
                else {
                    tdDiv.style.backgroundColor = "#FFFFFF";
                }
            }
        }
           

继续阅读