angularjs - Whats the equivalent for ng-grid's "beforeSelectionChange" in ui-grid? -


in ng-grid, used use beforeselectionchange in following way:

when user selects row, ajax call performed. while ajax call happenning set $scope.doingajaxcall = true, , prevent user changing selection, had in grid definition:

beforeselectionchange: function () {     return !($scope.doingajaxcall); }, 

which locks/freezes selection if ajax call happenning.

now, in ui-grid (aka ng-grid 3), i don't know whats equivalent afterselectionchange.

in section of documentation:
http://ui-grid.info/docs/#/api/ui.grid.selection.api:publicapi
see 2 events:

  • rowselectionchanges
  • rowselectionchangedbatch.

these seem equivalent of old afterselectionchange

and in section of documentation:
http://ui-grid.info/docs/#/api/ui.grid.selection.service:uigridselectionservice
see these 2 methods seem related need:

  • raiseselectionevent(grid, changedrows, event)
  • decideraiseselectionevent(grid, row, changedrows, event)

but don't understand how use them

important note:
i'm using multiselect: false (ie: 1 row can selected)

this bit of hack, it'll job done until find better solution. here's working plunker.

i assume use rowselectionchanged perform ajax call , toggle doingajaxcall.

gridapi.selection.on.rowselectionchanged($scope, function(row) {   $log.log('row ' + row.entity.id + ' selected: ' + row.isselected);    $log.log('  simulating ajax call...');   $scope.doingajaxcall = true;   $timeout(function() {     $log.log('  ...done ajax call');     $scope.doingajaxcall = false;   }, 2000); }); 

then, modify template ui-grid uses select buttons.

$templatecache.put('ui-grid/selectionrowheaderbuttons',   '<div ' +   '  class="ui-grid-selection-row-header-buttons ui-grid-icon-ok" ' +   '  ng-class="{\'ui-grid-row-selected\': row.isselected}" ' +   '  ng-click="grid.appscope.clickconditions() && selectbuttonclick(row, $event)"> ' + // modified template here   '  &nbsp; ' +   '</div>' ); 

this way, $scope.clickconditions() evaluated before actual click logic called. if it's falsy, selectbuttonclick, handles internal selection logic, never called.

$scope.clickconditions = function() {   // check other conditions need   return !$scope.doingajaxcall; }; 

as mentioned, hacky! there better ways overwrite templates (e.g. ui-grid/selectionrowheaderbuttons), when overwriting templates you'll have check logic when updating, should let user know happening visually when ajax call performed, etc.

a better solution fork repo , add own beforeselectionchange logic (probably starting here). seems haven't gotten elsewhere, hope gets started @ least!


Comments

Popular posts from this blog

html - Firefox flex bug applied to buttons? -

html - Missing border-right in select on Firefox -

python - build a suggestions list using fuzzywuzzy -