vignesh
vignesh

Reputation: 13

Angular js UI grid is not getting updated with new content

I am calling $http.get to get new content from the server for angular ui grid. On change of date in the datepicker I trigger an ng-change event to make another http call to get new content. The call is successful but the grid is not updated with new content.$scope.grid.core.notifyDataChange() throws error when called inside the http success call back.Please suggest ways to update the grid with new content.

Please find the plnkr code. when I click load button, I want to update grid with new JSON data using http call but it is not updating grid. http://plnkr.co/edit/S2A3scEoO6QIGFbru3Lr?p=preview

Upvotes: 0

Views: 1351

Answers (1)

imbalind
imbalind

Reputation: 1182

The problem with your example is inside $http's success method(lines 256-260).

$http.get(...).success(
  function(data){
    $scope.roData = data;
});

There you are just putting your data inside a scope property ($scope.roData), but then you're not doing anything with that scope property.

Furthermore you're trying to assign a wrong value to uiGrid.gridOptions.data with the lines:

if($scope.gridOptions.data ==='rData'){
  $scope.gridOptions.data = 'roData';
}

But you did 2 mistakes:

  1. Treating variables as string, and this is not going to work. Inside your JS files you need to access your scope with $scope.nameOfVariable not by using their names as strings like 'nameOfVariable'.

  2. You put these lines outside of your success method, so they are executed before you actually get your data.

I managed to edit your plunker and make it work, you can find it here. What I did was putting your lines together and fix the name error. I did not put there any if since I don't know what logic you wanted to accomplish.

$http.get(...).success(
  function(data){
    $scope.roData = data;
    $scope.gridOptions.data = $scope.roData;
});

Upvotes: 1

Related Questions