easyui grid 增加合计行

Posted 2021-01-03 yigexiaojiangshi

 一、首先，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;