入门客AI创业平台(我带你入门,你带我飞行)
博文笔记

EasyUi Datagrid中footer修改行样式的问题

创建时间:2014-07-25 投稿人: 浏览次数:7012

默认的"rowStyler" 选项不支持footer,想让footer支持rowStyler的话,dategird就得重写。代码如下

var myview = $.extend({}, $.fn.datagrid.defaults.view, {

    renderFooter: function(target, container, frozen){

        var opts = $.data(target, "datagrid").options;

        var rows = $.data(target, "datagrid").footer || [];

        var fields = $(target).datagrid("getColumnFields", frozen);

        var table = ["<table class="datagrid-ftable" cellspacing="0" cellpadding="0" border="0"><tbody>"];

         

        for(var i=0; i<rows.length; i++){

            var styleValue = opts.rowStyler ? opts.rowStyler.call(target, i, rows[i]) : "";

            var style = styleValue ? "style="" + styleValue + """ : "";

            table.push("<tr class="datagrid-row" datagrid-row-index="" + i + """ + style + ">");

            table.push(this.renderRow.call(this, target, fields, frozen, i, rows[i]));

            table.push("</tr>");

        }

         

        table.push("</tbody></table>");

        $(container).html(table.join(""));

    }

});

$("#list").datagrid({

     view:myview

     });

  <table id = "list" class="easyui-datagrid" title="投资情况统计表" style="width:960;"fixRowHeight="true" 

                data-options="rownumbers:false,singleSelect:true,url:"<%=webRoot %>/hqswq/report/tzqkInfo.do?nf=<%=nf %>",method:"get",showFooter: true,rowStyler: function(index,row){

                    if (row.fg == "总计"){

                        return "background-color:#6293BB;color:#fff;font-weight:bold;";

                    }

                }">

 

声明:该文观点仅代表作者本人,入门客AI创业平台信息发布平台仅提供信息存储空间服务,如有疑问请联系rumenke@qq.com。