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;