jgrid 单元格选中事件 onCellSelect

最新推荐文章于 2023-08-31 10:48:59 发布

你是夏天的味道

最新推荐文章于 2023-08-31 10:48:59 发布

阅读量3.7k

点赞数

CC 4.0 BY-SA版权

分类专栏：前端文章标签： jgrid onCellSelect

本文链接：https://blog.youkuaiyun.com/LI_ANGGEZI/article/details/41743859

前端专栏收录该内容

2 篇文章

订阅专栏

本文介绍了如何在jgrid中实现单元格选中事件onCellSelect，以便在点击统计结果的特定单元格时，显示对应的统计明细信息。通过创建两个grid，一个展示统计结果，另一个展示明细，利用onCellSelect方法获取选中行和列的数据，并强调了在处理选中事件时，全局变量更新的时机和顺序的重要性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

对于一个统计结果的jgrid，如果想在选中某个具体的单元格时需要显示该单元格统计结果的来源，即统计的明细信息。例如下面的jgrid是对各个单位不同项目类型的统计数：

现在想在点击某个特定的单元格时，显示明细。

首先，很显然需要两个grid，一个用于显示统计结果，一个用于显示明细。

关键代码如下截图：

首先定义了全局变量selectedIndex和selectedData，注意在页面初始化时对这两个变量初始化！反查询人员grid（pyhtgl_pyhtxxQueryCount_dialog_queryPYHT_grid）就是用于显示统计明细的，统计grid

（pyhtgl_pyhtxxQueryCount_statistic_grid）于显示统计结果。

在统计grid中添加了onCellSelect方法，该方法有四个参数：rowid,iCol,cellcontent,e，当点击单元格时触发。rowid：当前行id；iCol：当前单元格索引；cellContent：当前单元格内容；e：event对象。在单击单元格时使用selectedData = pyhtgl_pyhtxxQueryCount_statistic_grid.ylzgrid('getRowItem', rowid)取得当前选中的行，从而获得具体的单位名称，通过参数index获得选中的列的索引（从1开始），从而获得选中的项目。

需要注意的是：如果未在onCellSelect中使用

selectedData = pyhtgl_pyhtxxQueryCount_statistic_grid.ylzgrid('getRowItem', rowid)为全局变量selectedData赋值，而是为统计grid添加onSelectRow方法，并使用selectedData = pyhtgl_pyhtxxQueryCount_statistic_grid.ylzgrid('getRowItem', rowid)为局变量selectedData赋值。那么结果是：每次单击单元格时，单位都会查错，总是会查到上次选中行的单位。这是因为onCellSelect方法先于onSelectRow执行，所以当加载反查grid时，selectedData 还没来得及被赋予最新的选中行。这点切记！！！