EasyUI的Datagrid页脚Footer怎么使用jquery更改

重载行底记录。 示例:

// update footer row values and then refresh

var rows = $('#dg').datagrid('getFooterRows')

rows[0]['name'] = 'new name'

rows[0]['salary'] = 60000

$('#dg').datagrid('reloadFooter')

// update footer rows with new data

$('#dg').datagrid('reloadFooter',[

{name: 'name1', salary: 60000},

{name: 'name2', salary: 65000}

])

默认的'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:#6293BBcolor:#ffffont-weight:bold'

                    }

                }">

这是效果

---