Fixes #332, #369. Watchable totalServerItems

Thanks to @keithharvery for the PR. The `totalServerItems` grid option can once again be set to a string, which will be watched by the grid and reflected in the footer if updated. Also added tests to directivesSpec.js for using a normal number and using a string.
angular-ui · May 3, 2013 · fcfe316 · fcfe316
1 parent 972303b
commit fcfe316
Show file tree

Hide file tree

Showing 3 changed files with 76 additions and 7 deletions.
diff --git a/src/classes/footer.js b/src/classes/footer.js
@@ -1,6 +1,6 @@
 var ngFooter = function ($scope, grid) {
     $scope.maxRows = function () {
-        var ret = Math.max(grid.config.totalServerItems, grid.data.length);
+        var ret = Math.max($scope.totalServerItems, grid.data.length);
         return ret;
     };
 
@@ -12,7 +12,7 @@
 
     $scope.pageForward = function() {
         var page = $scope.pagingOptions.currentPage;
-        if (grid.config.totalServerItems > 0) {
+        if ($scope.totalServerItems > 0) {
             $scope.pagingOptions.currentPage = Math.min(page + 1, $scope.maxPages());
         } else {
             $scope.pagingOptions.currentPage++;
@@ -36,15 +36,15 @@
     $scope.cantPageForward = function() {
         var curPage = $scope.pagingOptions.currentPage;
         var maxPages = $scope.maxPages();
-        if (grid.config.totalServerItems > 0) {
+        if ($scope.totalServerItems > 0) {
             return !(curPage < maxPages);
         } else {
             return grid.data.length < 1;
         }
 
     };
     $scope.cantPageToLast = function() {
-        if (grid.config.totalServerItems > 0) {
+        if ($scope.totalServerItems > 0) {
             return $scope.cantPageForward();
         } else {
             return true;

diff --git a/src/directives/ng-grid.js b/src/directives/ng-grid.js
@@ -27,9 +27,28 @@
                                 grid.eventProvider.assignEvents();
                                 domUtilityService.RebuildGrid($scope, grid);
                             }, true);
-                        } else {
+                        }
+                        else {
     						grid.buildColumns();
     					}
+
+                        // Watch totalServerItems if it's a string
+                        if (typeof options.totalServerItems == "string") {
+                            $scope.$parent.$watch(options.totalServerItems, function (newTotal, oldTotal) {
+                                // If the newTotal is not defined (like during init, set the value to 1)
+                                if (!angular.isDefined(newTotal)) {
+                                    $scope.totalServerItems = 1;
+                                }
+                                // Otherwise set the value to the new total
+                                else {
+                                    $scope.totalServerItems = newTotal;
+                                }
+                            });
+                        }
+                        // If it's NOT a string, then just set totalServerItems to its value
+                        else {
+                            $scope.totalServerItems = options.totalServerItems;
+                        }
 
                         // if it is a string we can watch for data changes. otherwise you won't be able to update the grid data
                         if (typeof options.data == "string") {

diff --git a/test/unit/directivesSpec.js b/test/unit/directivesSpec.js
@@ -211,8 +211,58 @@ describe('directives', function () {
                 });
             });
             describe('footer', function () {
-                it('should do something', function () {
-                    //add work here
+                var scope,
+                    elm,
+                    element,
+                    comp;
+
+                beforeEach(inject(function ($rootScope, $compile) {
+                    scope = $rootScope;
+                    comp = $compile;
+
+                    elm = angular.element(
+                        '<div ng-grid="gridOptions" style="width: 1000px; height: 1000px"></div>'
+                    );
+
+                    scope.myData = [{name: "Moroni", age: 50},
+                                         {name: "Tiancum", age: 43},
+                                         {name: "Jacob", age: 27},
+                                         {name: "Nephi", age: 29},
+                                         {name: "Enos", age: 34}];
+
+                    scope.gridOptions = {
+                        data: 'myData',
+                        totalServerItems: 357
+                    };
+                }));
+
+                it('should show the proper number of total items when it is a number', function(){
+                    // Compile the grid as-is with a stringy totalServerItems
+                    element = comp(elm)(scope);
+                    scope.$digest();
+
+                    expect(element.find('.ngFooterTotalItems').text()).toContain(357);
+                });
+
+                it('should update the total items when totalServerItems is increased', function () {
+                    // Compile the grid with a stringy totalServerItems
+                    scope.serverItems = 357;
+                    scope.gridOptions.totalServerItems = 'serverItems';
+                    element = comp(elm)(scope);
+                    scope.$digest();
+
+                    // The number should be correct of the bat
+                    expect(element.find('.ngFooterTotalItems').text()).toContain(357);
+
+                    // If we update the totalServerItems...
+                    scope.serverItems = 308;
+                    scope.$digest();
+
+                    // ...totalServerItems in the grid's scope should be updated.
+                    expect(element.scope().totalServerItems).toEqual(308);
+
+                    // ...it should be reflected in the default footer template
+                    expect(element.find('.ngFooterTotalItems').text()).toContain(308);
                 });
             });
             describe('grid', function () {