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;

  

posted @ 2018-09-03 18:33  小僵尸  阅读(1471)  评论(0编辑  收藏  举报