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的教程！