CODEWITHSUNDEEP
angularjsngtable
texas697
texas697

Reputation: 6397

ngTable reload function not updating table

Ive tried different solutions people have used to solve the same problem but I am having no luck. I am trying to update the table after a $http call without refreshing the entire page. I use the "push" to update the arrays on non ngTables with no issue. any help would be great, thanks I am getting this error message

TypeError: Cannot read property 'push' of undefined

When I remove the push command it does nothing.

  //Job  Table
     var data = [];
$http.get("/api/apiJob/").success(function (result) {
    data = result;
});
$scope.tableParams = new ngTableParams({
    page: 1,            // show first page
    count: 5           // count per page
}, {
    total: data.length, // length of data
    getData: function ($defer, params) {
        params.total(data.length);
        $defer.resolve(data.slice((params.page() - 1) * params.count(), params.page() * params.count()));
    }
});
//Update Job

$scope.updateJob = function (job) {
    job.JobTypeId = $scope.active.JobType.JobTypeId;
    job.JobClassId = $scope.active.JobClass.JobClassId;
    job.GeoAreaId = $scope.active.GeoArea.GeoAreaId;
    job = $scope.active;
    JobUpdate.update(job).success(function (job) {
        $scope.data.push(job);
        $scope.tableParams.reload();
        $scope.ok();
    }).error(function () {
        toastr.error('Error!');
    })
    console.log(job);
};

Update

 $scope.data = []
//var data = [];
$http.get("/api/apiJob/").success(function (result) {
    data = result;
});

Error Message is at data = result;

ReferenceError: data is not defined

Upvotes: 1

Views: 3683

Answers (1)

Pedro Moreira
Pedro Moreira

Reputation: 965

You are defining var data = []; instead or $scope.data = []; Which means that $scope.data does not exist, causing the exception you showed. To solve it it's necessary to replace all references to data to local scope and replace by $scope.data.

Angular $scope only use the variables assigned to it, ignoring the environment variables. In your case, the variable data is being updated, but it is not known by your $scope.

Also, the function JobUpdate.update(job).success(function (job) { is not applying changes to scope because it's in a different context, in this case you need to use $scope.apply, example:

$scope.$apply(function() {
    $scope.data.push(job);
    $scope.tableParams.reload();
    $scope.ok();
});

You can check more information about $scope here: AngularJS Scope Doc: https://docs.angularjs.org/guide/scope

Scope issue: http://nathanleclaire.com/blog/2014/01/31/banging-your-head-against-an-angularjs-issue-try-this/

Upvotes: 1

Related Questions