加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angularjs – 在ui-grid数据刷新后保持选择

发布时间:2020-12-17 18:05:42 所属栏目:安全 来源:网络整理
导读:我在我的网络应用程序中使用ui-grid. 一切都运行正常,问题是当我刷新网格数据时,选择被删除. 在小提琴中,当我选择一行然后点击刷新按钮时,ui-grid选择被删除. JSFiddle:http://jsfiddle.net/mdawood1991/xyuotpe8/6/ HTML: div ng-controller="MyCtrl as c
我在我的网络应用程序中使用ui-grid.

一切都运行正常,问题是当我刷新网格数据时,选择被删除.

在小提琴中,当我选择一行然后点击刷新按钮时,ui-grid选择被删除.

JSFiddle:http://jsfiddle.net/mdawood1991/xyuotpe8/6/

HTML:

<div ng-controller="MyCtrl as controller">
    <button ng-click="controller.refreshData()" type="button">
    Refresh
  </button>

  <div ui-grid="controller.assetListGrid" ui-grid-selection></div>


</div>

控制器:

var myApp = angular.module('myApp',["ui.grid","ui.grid.selection"]);

//myApp.directive('myDirective',function() {});
//myApp.factory('myService',function() {});

myApp.controller("MyCtrl",function($scope) {
  var self = this;
  $scope.name = 'Superhero';

  self.assetListGrid = {};

  self.gridOptions = {
    enableFiltering: true,enableGridMenu: true,ang
    enableColumnMenus: false,enableRowSelection: true,enableSelectAll: false,multiSelect: false,enableHorizontalScrollbar: 1,columnDefs: [{
      name: 'assetId'
    },{
      name: 'reference',enableHiding: false,width: 250,resizeable: true
    }],onRegisterApi: function(gridApi) {
      self.assetGridObject = gridApi;

      // register the onRowSelect Function here
      //this.assetGridObject.selection.on.rowSelectionChanged(null,function(row) {
      //   if (row.isSelected)
      // });
    },appScopeProvider: self
  }

  self.initGrid = function() {
    self.assetListGrid = self.gridOptions;
    self.assetListGrid.data = "controller.gridAssets"
  }

  self.loadInitData = function() {
    self.gridAssets = [{
      assetId: 1,reference: "Dawood"
    },{
      assetId: 2,reference: "Dawood 2"
    },{
      assetId: 3,reference: "Dawood 3"
    },{
      assetId: 4,reference: "Dawood 4"
    },]
  }

  self.refreshData = function() {
    console.log("Data refresh")

    self.gridAssets = [{
      assetId: 1,reference: "Refresh"
    },reference: "Refresh 2"
    },reference: "Refresh 3"
    },reference: "Refresh 4"
    },]
  }

  self.initGrid();
  self.loadInitData();

});

我如何保持选择?

解决方法

好像我找到了一个解决方案:

我做的是在选择行时,首先将选定的行放在临时对象中

onRegisterApi: function(gridApi) {
    self.assetGridObject = gridApi;

    // register the onRowSelect Function here
    self.assetGridObject.selection.on.rowSelectionChanged(null,function(row) {
      if (row.isSelected) {
        self.assetGridObject.grid.appScope.selectedRow = row.entity;
      }
    });

  },

FIDDLE:http://jsfiddle.net/mdawood1991/02dpggyo/2/

然后,当刷新数据时,我正在检查是否选择了一行,如果选择了一行,我将从新数据数组中获取该行的最新值,这就是刷新数据方法现在的样子:

self.refreshData = function() {
  console.log("Data refresh")


  self.gridAssets = 
  [
    {assetId: 1,reference: "Refresh 1"},{assetId: 2,reference: "Refresh 2"},{assetId: 3,reference: "Refresh 3"},{assetId: 4,reference: "Refresh 4"}];

  if (self.selectedRow) 
  {
    console.log("Row is selected");


    //THIS LINE HERE I THINK IS THE KEY -
    self.assetGridObject.grid.modifyRows(self.gridAssets);


    // GET THE ROW FROM NEWLY LOADED DATA 
    var selectedRoww = null;

    for (var i = 0; i < self.gridAssets.length; i++) 
    {

      //COMPARING BASED ON MY asseId AS THIS IS THE VALUE THAT WILL NOT CHANGE IN MY GRID  - OTHER COLUMS CAN CHANGE

      if (self.gridAssets[i].assetId == self.selectedRow.assetId) 
      {
        selectedRoww = self.gridAssets[i];
      }

    }

    // THIS LINE HERE IS SELECTING THE ROW FROM THE GRID

    self.assetGridObject.selection.selectRow(selectedRoww);

  }

}

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读