jQuery EasyUI使用教程之在数据网格的页脚中显示摘要信息

<jQuery EasyUI最新试用版免费下载>

在本教程中，咱们将为您展现如何在数据网格的页脚中显示摘要信息行。

查看jQuery EasyUI演示

想要显示页脚行，您应该将showFooter属性设置为true，而后准备定义在数据网格数据中的页脚行。如下是示例数据：

{"total":1,"rows":[{"id":1,"name":"Chai","price":18.00}],"footer":[{"name":"Total","price":18.00}]}

建立数据网格

< table id = "tt" title = "DataGrid" class = "easyui-datagrid" style = "width:400px;height:250px" url = "data/datagrid17_data.json" fitcolumns = "true" rownumbers = "true" showfooter = "true" >

< thead >

< tr >

< th field = "name" width = "80" >Product Name</ th >

< th field = "price" width = "40" align = "right" >Unit Price</ th >

</ tr >

</ thead >

</ table >

页脚行和显示数据行同样，因此您能够在页脚显示不止一个摘要信息。

下载EasyUI示例：easyui-datagrid-demo.zip

有兴趣的朋友能够点击查看更多有关jQuery EasyUI的教程！