easyui grid 增加合计行

Posted yigexiaojiangshi

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easyui grid 增加合计行相关的知识,希望对你有一定的参考价值。

 一、首先,easyui  grid 的 showfooter 属性设置为 true

 

$aplgrid.datagrid({
            data: globalExpenseClaimForm.ExpenseClaimItemLists,
            title: "申请信息",
            width: 1140,
            singleSelect: false,
            showFooter: true,

//其他代码
});

 

  

 

二、用于渲染的数据 有特定的格式

        (a)后台直接返回特定的格式

        如下所示:  

{
	"rows": [
		{
			"CreateDate": "24/07/2018",
			"BillCode": "UN123",
			"TotalPrice":30
		}
	],
	"footer":[
		{
			"BillCode": "合计(元)",
			"TotalPrice":0
		}
	]
}

  (b)当后台返回的格式不符合预期的时候,

                 1)我们可以对获取的数据 进行 转化,最终成为需要的格式

                如下:

        globalExpenseClaimForm.ExpenseClaimItemLists = {
            rows: globalExpenseClaimForm.ExpenseClaimItemList, footer: [{ AmountWithTax: null, InvoiceCode: "合计(元)"}]
        };

     2)再把该对象赋值 给easyui grid 的 data 属性

      如下:

 $aplgrid.datagrid({
            data: globalExpenseClaimForm.ExpenseClaimItemLists,

           //其他代码
})
        

      3)在提交的时候,记得把之前的对象转过来

                           我之前是把获取的json 对象 新加 了一个符合格式的 属性

                            那在提交的时候就把这个属性删掉就可以了

                           如下:

delete globalExpenseClaimForm.ExpenseClaimItemLists;

  

以上是关于easyui grid 增加合计行的主要内容,如果未能解决你的问题,请参考以下文章

EASYUI DATAGRID加合计

extjs3.1 解决列锁定,合计行不能滑动的问题

easyUI----grid

jquery easyui datagrid 加每页合计和总合计,请教怎么来做

Easyui 表格底部加合计

easyUI 两个grid表格数据左移右移代码