数据表格中展开行显示详情

使用教程 » 数据表格中展开行显示详情

datagrid可以更改视图以显示不同的效果。 使用detail视图,datagrid可以在数据行左侧显示展开按钮(“+”或“-”)。 用户可以展开一行以显示其他详细信息。

步骤一: 创建数据表格

步骤二: 为DataGrid设置详细视图

要使用detail视图,请记住将视图脚本文件包含到页眉中.

我们定义了'detailFormatter'函数来告诉datagrid如何呈现细节视图。 在本例中,我们返回一个简单的div元素,它将充当详细内容容器。 请注意,详细内容是空的。当用户单击expand按钮('+')时,将触发'onExpandRow'事件。 因此,我们可以编写一些代码来加载ajax细节内容。 最后,我们调用'fixDetailRowHeight'方法来固定加载细节内容时的行高度。

步骤三:服务器代码

datagrid21_getdetail.php

下载 EasyUI 实例:

easyui-datagrid-demo.zip