Issue with ngTable: Error retrieving data for server-side pagination

Question

Issue with ngTable: Error retrieving data for server-side pagination

I am currently working on setting up a server-side table using ng-table. However, I am encountering some issues with the getData function. It keeps giving me errors such as $defer.resolve is not a function or params is not defined.

I noticed that I can access the params variable when I don't use $defer in the getData function.

Here's a snippet of my code:

angular.module('ngTableTest', ['ui.router', 'ngTable'])
.controller('Table', function($state, NgTableParams){
   var vm = this;

   vm.niceTable = new NgTableParams({}, {
      getData: function($defer, params) {
        $http.get('/app/getdata')
            .success(function(data) {
               params.total(data.count);
               $defer.resolve(data.data);
            });
        }
      });
});

Any insights would be greatly appreciated!

javascript angularjs ngtable

Answer 1

Answer №1

When using $defer, don't forget to include $q in your code. Give this a try:

angular.module('ngTableTest', ['ui.router', 'ngTable'])
.controller('Table', function($state, $q, NgTableParams){
   var vm = this;

   vm.niceTable = new NgTableParams({}, {
      getData: function(params) {
        var deferred = $q.defer();
        $http.get('/app/getdata')
            .success(function(data) {
               params.total(data.count);
               deferred.resolve(data.data);
            });
        }
      });
});

Answer 2

When using $defer, don't forget to include $q in your code. Give this a try:

angular.module('ngTableTest', ['ui.router', 'ngTable'])
.controller('Table', function($state, $q, NgTableParams){
   var vm = this;

   vm.niceTable = new NgTableParams({}, {
      getData: function(params) {
        var deferred = $q.defer();
        $http.get('/app/getdata')
            .success(function(data) {
               params.total(data.count);
               deferred.resolve(data.data);
            });
        }
      });
});

Answer 3

Answer №2

I encountered the same problem and managed to find a solution that worked for me:

angular.module('ngTableTest', ['ui.router', 'ngTable'])
.controller('Table', function($state, $q, NgTableParams){
   var vm = this;

   vm.niceTable = new NgTableParams({}, {

     getData: function(params) {

         var promise =  
           $http.get('/app/getdata')
            .success(function(data) {
               params.total(data.count);

               // additional data manipulation can be done here
               return $q.resolve(data); 
            });
           }
        });
        return $q.resolve(promise); 
});

It's important to note that in the current version of NgTable, the getdata method now only accepts one parameter (params), whereas it used to accept two parameters ($defer and params).

It appears that getdata must return a resolved promise. In the code provided, the promise was resolved within the success method instead of directly in the getdata method.

This solution worked for me after some trial and error. I hope that someone with more expertise can provide further insight into how $q.resolve functions and the return value of getdata functions.

Answer 4

I encountered the same problem and managed to find a solution that worked for me:

angular.module('ngTableTest', ['ui.router', 'ngTable'])
.controller('Table', function($state, $q, NgTableParams){
   var vm = this;

   vm.niceTable = new NgTableParams({}, {

     getData: function(params) {

         var promise =  
           $http.get('/app/getdata')
            .success(function(data) {
               params.total(data.count);

               // additional data manipulation can be done here
               return $q.resolve(data); 
            });
           }
        });
        return $q.resolve(promise); 
});

It's important to note that in the current version of NgTable, the getdata method now only accepts one parameter (params), whereas it used to accept two parameters ($defer and params).

It appears that getdata must return a resolved promise. In the code provided, the promise was resolved within the success method instead of directly in the getdata method.

This solution worked for me after some trial and error. I hope that someone with more expertise can provide further insight into how $q.resolve functions and the return value of getdata functions.

Issue with ngTable: Error retrieving data for server-side pagination

Answer №1

Answer №2

Similar questions

Tips for stopping ajax requests from automatically following redirects in jQuery

Tips for controlling input length using ng-pattern

What's causing Angular to not display my CSS properly?

Numbering Tables Effectively in ReactJS

Ways to troubleshoot and resolve the jQuery error with the message "TypeError: 'click' called"

Looking to create a drag-and-drop form designer within a web browser - Is AngularJS the optimal framework for this task?

Having trouble retrieving data from the database when passing input to a mongoose query using an href tag in Node.js

Transforming a JSON object property value from an array into a string using JavaScript

Setting up angular-cli project for rc5- Step by step guide

"The JavaScript code that functions perfectly in the browser console, but fails to execute when running in the actual

Laravel validation successfully validates Vanilla AJAX request, but the controller does not receive the values

Discovering ways to access deeply nested JSON data in Vue JS

What is the process for converting a buffer into an image file?

Having trouble invoking a service method within an Angular factory (with Ionic)?

Is there a way to track when the Angular DTOptionsBuilder ajax call is complete and trigger a callback function?

What is the maximum number of JSON responses that can be handled by AJAX?

Detect errors in the `valueChanges` subscription of Firestore and attempt a retry if an error occurs

Modify the content of a div by clicking on a word or link using Javascript

The Angular Factory service is accurately retrieving data, but unfortunately, it is not being displayed on the user interface

Utilizing jQuery to send AJAX requests and display the results on separate lines within a textarea