【angularjs】表格选中行定位

原创于 2019-03-08 11:00:07 发布 · 1.4k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#grid行定位

=====前端===== 同时被 2 个专栏收录

26 篇文章

订阅专栏

Angularjs前端

13 篇文章

订阅专栏

本文介绍了一种在网页应用中实现用户在二级页面返回后，仍能保持之前选中行位置的方法。通过监听页面变化事件，记录当前页数及选中行信息，确保在数据重新加载时能够准确定位到先前的位置。

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

效果：

弹出二级页返回后，仍旧定位到上次选中行

主页js的代码：

1.监控选中的是哪一页

              $rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) {
                  if (!$.isEmptyObject(fromParams)) {
                      getData(self.gridOptions.paginationCurrentPage);
                  }
              })

2.定位选中的是哪一行，写在grid代码中

              self.gridOptions = {
                  isRowSelectable: function (row) { //GridRow 
                      if (selectRows.length > 0) {
                          if (row.entity.ProductOrder == selectRows[0].ProductOrder) {
                              row.grid.api.selection.selectRow(row.entity); // 选中行
                          }
                      }
                      else {
                          row.grid.api.selection.clearSelectedRows(); // 清空选中行
                      }
                  },
              };

3.查完数据显示时，判断是否有页数

              var getData = function (currentPage) {
                  //调用方法查询表格数据
                      if (response.data.length == 0) {
                          $scope.myData = [];
                      }
                      else {
                          mydefaultData = response.data.rows;
                          if (typeof (currentPage) == "undefined") {
                              currentPage = 1;
                          }
                          getPage(currentPage, self.gridOptions.paginationPageSize);
                      }
              }