grid表格

xiaoxiao2021-02-28  134

修改表行标题:(headerTemplate)

{ field: "threeStar", title: '3', width: 80, headerTemplate: '3 <i class="fa fa-star" aria-hidden="true"></i>' }

效果:

表格一级标题

{ title:'1', columns:[{ field: "one", title: '2', width: 120 }, { field: "two", title: '3', width: 100 }] }

效果:

合计:

获取表格数据

function getDataSource(){ return new kendo.data.DataSource({ data:reportData, aggregate: [ { field: "member", aggregate: "sum" }, { field: "useMount", aggregate: "sum" }, { field: "appCustomer", aggregate: "sum" }, { field: "appMember", aggregate: "sum" }, { field: "sellCard", aggregate: "sum" }, { field: "prepaid", aggregate: "sum" }, { field: "orderGross", aggregate: "sum" }, { field: "order", aggregate: "sum" } ], pageSize:15 }) }

合计行:

{ field:"one", title:'1', width:120, footerTemplate: "<div class='bold'>合计:<span class='mgle5' id='allStore'></span></div>" }

对应需要合计的行:

{ field:"one", title:'1', width:100, footerTemplate: "<span class='foot_total' id='member'></span>" }

合计行函数:

dataBound: function () { var that=this; //计算合计 $('.k-footer-template span.foot_total').each(function (index) { var field=that.dataSource.aggregate()[index].field; var value = that.dataSource.aggregates()[field].sum; $(this).html(value.toFixed(2)); }) }, }).data('kendoGrid');

效果:

转载请注明原文地址: https://www.6miu.com/read-80672.html

最新回复(0)