angularjs-table icon indicating copy to clipboard operation
angularjs-table copied to clipboard

Table should jump to last available page when number of pages decrease on server side

Open ldwnt opened this issue 7 years ago • 1 comments

Suppose pagination and server side data is used.

At first, we have 11 rows (10 rows per page thus 2 pages: page 0 and page 1): row 0 to row 10. And page 1 is displayed in the table.

Now we select the row 10 and delete it, then we need to force refresh the table: $rootScope.$broadcast('angular-mesa:update-dummy-rows');

Currently table gets a result of 0 rows and total=10 from server. So it displays no rows and no pagination control, leaving user no choice but to refresh the web page.

In my opinion, once table finds 0 rows but the total>0, it should requests again for the last page, and in this case, page 0, so that page 0 can be shown in table.

ldwnt avatar Jul 05 '18 10:07 ldwnt

I have something in mind about this issue, but not sure whether the fix is right: function UpdateVisibleRowsAsync(scope) { ...

  scope.api.setLoading(true);
  var getDataPromise = scope.transientState.getDataPromise = scope.options.getData(offset, scope.persistentState.rowLimit, activeFilters, activeSorts);
  getDataPromise.then(tryParseData.bind(this, getDataPromise, scope, offset), function (e) {
    scope.transientState.getDataPromise = null;
    scope.transientState.loadingError = true;
    scope.getDataError = e;
    scope.api.setLoading(false);
  });
}

function tryParseData(getDataPromise, scope, offset, res) {
  if (getDataPromise !== scope.transientState.getDataPromise) {
    // new request made, cancelling this one
    return;
  }
  var total = res.total;
  var rows = res.rows;
  var i = offset;
  if(rows.length == 0 && total > 0 && scope.options.pagingStrategy === 'PAGINATE') {
    scope.transientState.pageOffset -= 1;
    UpdateVisibleRowsAsync(scope);
  }
  scope.transientState.rowOffset = offset;
  scope.transientState.filterCount = total;
  scope.visible_rows = rows;
  rows.forEach(function (row) {
    row.$$$index = i++;
  });
  scope.transientState.getDataPromise = null;
  scope.api.setLoading(false);
  scope.getDataError = undefined;
  scope.$emit('angular-mesa:update-dummy-rows');
}

ldwnt avatar Jul 05 '18 10:07 ldwnt