From 2dfafb1956aa65ac277afb0adb9a1c256067237e Mon Sep 17 00:00:00 2001 From: Istvan Fodor Date: Wed, 23 Dec 2015 12:56:42 +0100 Subject: [PATCH] fix scrollbar when pagination switched on --- dist/main.css | 4 + dist/md-data-table-style.css | 4 + dist/md-data-table.js | 254 +++++++++++++++++------------------ 3 files changed, 135 insertions(+), 127 deletions(-) diff --git a/dist/main.css b/dist/main.css index 58326b6..2b899d5 100644 --- a/dist/main.css +++ b/dist/main.css @@ -99,6 +99,10 @@ font-size: 12px; color: #757575; } +.mdDataTable .mdDataTable-footer .mdDataTable-pagination md-input-container, .mdDataTable tr th .mdDataTable-pagination md-input-container { + margin-top: 0px; + margin-bottom: 0px; +} .mdDataTable .checkboxCell { width: 18px; /*the next cell should not have just 24px padding */ diff --git a/dist/md-data-table-style.css b/dist/md-data-table-style.css index 58326b6..2b899d5 100644 --- a/dist/md-data-table-style.css +++ b/dist/md-data-table-style.css @@ -99,6 +99,10 @@ font-size: 12px; color: #757575; } +.mdDataTable .mdDataTable-footer .mdDataTable-pagination md-input-container, .mdDataTable tr th .mdDataTable-pagination md-input-container { + margin-top: 0px; + margin-bottom: 0px; +} .mdDataTable .checkboxCell { width: 18px; /*the next cell should not have just 24px padding */ diff --git a/dist/md-data-table.js b/dist/md-data-table.js index 7ad5264..baf427a 100644 --- a/dist/md-data-table.js +++ b/dist/md-data-table.js @@ -406,6 +406,94 @@ (function(){ 'use strict'; + function mdDataTableCellDirective($parse){ + return { + restrict: 'E', + replace: true, + transclude: true, + scope: { + htmlContent: '@' + }, + require: ['^mdDataTable','^mdDataTableRow'], + link: function($scope, element, attrs, ctrl, transclude){ + var mdDataTableRowCtrl = ctrl[1]; + + transclude(function (clone) { + //TODO: rework, figure out something for including html content + if($scope.htmlContent){ + mdDataTableRowCtrl.addToRowDataStorage(clone, 'htmlContent'); + }else{ + //TODO: better idea? + var cellValue = $parse(clone.html().replace('{{', '').replace('}}', ''))($scope.$parent); + mdDataTableRowCtrl.addToRowDataStorage(cellValue); + } + }); + } + }; + } + mdDataTableCellDirective.$inject = ['$parse']; + + angular + .module('mdDataTable') + .directive('mdDataTableCell', mdDataTableCellDirective); +}()); +(function(){ + 'use strict'; + + function mdDataTableRowDirective(IndexTrackerFactory){ + return { + restrict: 'E', + transclude: true, + require: '^mdDataTable', + scope: { + tableRowId: '=' + }, + controller: ['$scope', function($scope){ + var vm = this; + + vm.addToRowDataStorage = addToRowDataStorage; + $scope.rowDataStorage = []; + + initIndexTrackerServiceAndBindMethods(); + + function initIndexTrackerServiceAndBindMethods(){ + var indexHelperService = IndexTrackerFactory.getInstance(); + + vm.increaseIndex = _.bind(indexHelperService.increaseIndex, indexHelperService); + vm.getIndex = _.bind(indexHelperService.getIndex, indexHelperService); + } + + function addToRowDataStorage(value, contentType){ + if(contentType === 'htmlContent'){ + $scope.rowDataStorage.push({value: value, type: 'html'}); + }else{ + $scope.rowDataStorage.push(value); + } + } + }], + link: function($scope, element, attrs, ctrl, transclude){ + appendColumns(); + + ctrl.addRowData($scope.tableRowId, $scope.rowDataStorage); + //ctrl.increaseIndex(); + + function appendColumns(){ + transclude(function (clone) { + element.append(clone); + }); + } + } + }; + } + mdDataTableRowDirective.$inject = ['IndexTrackerFactory']; + + angular + .module('mdDataTable') + .directive('mdDataTableRow', mdDataTableRowDirective); +}()); +(function(){ + 'use strict'; + function mdDataTableColumnDirective(){ return { restrict: 'E', @@ -484,6 +572,45 @@ (function(){ 'use strict'; + function mdDataTableCardFooterDirective(){ + return { + restrict: 'E', + templateUrl: '/main/templates/mdDataTableCardFooter.html', + transclude: true, + replace: true, + scope: true, + require: ['^mdDataTable'], + link: function($scope){ + + } + }; + } + + angular + .module('mdDataTable') + .directive('mdDataTableCardFooter', mdDataTableCardFooterDirective); +}()); +(function(){ + 'use strict'; + + function mdDataTableCardHeaderDirective(){ + return { + restrict: 'E', + templateUrl: '/main/templates/mdDataTableCardHeader.html', + transclude: true, + replace: true, + scope: true, + require: ['^mdDataTable'] + }; + } + + angular + .module('mdDataTable') + .directive('mdDataTableCardHeader', mdDataTableCardHeaderDirective); +}()); +(function(){ + 'use strict'; + function mdDataTableAddAlignClass(ColumnAlignmentHelper){ return { restrict: 'A', @@ -596,131 +723,4 @@ angular .module('mdDataTable') .directive('mdDataTableSortHandler', mdDataTableSortHandlerDirective); -}()); -(function(){ - 'use strict'; - - function mdDataTableCardFooterDirective(){ - return { - restrict: 'E', - templateUrl: '/main/templates/mdDataTableCardFooter.html', - transclude: true, - replace: true, - scope: true, - require: ['^mdDataTable'], - link: function($scope){ - - } - }; - } - - angular - .module('mdDataTable') - .directive('mdDataTableCardFooter', mdDataTableCardFooterDirective); -}()); -(function(){ - 'use strict'; - - function mdDataTableCardHeaderDirective(){ - return { - restrict: 'E', - templateUrl: '/main/templates/mdDataTableCardHeader.html', - transclude: true, - replace: true, - scope: true, - require: ['^mdDataTable'] - }; - } - - angular - .module('mdDataTable') - .directive('mdDataTableCardHeader', mdDataTableCardHeaderDirective); -}()); -(function(){ - 'use strict'; - - function mdDataTableCellDirective($parse){ - return { - restrict: 'E', - replace: true, - transclude: true, - scope: { - htmlContent: '@' - }, - require: ['^mdDataTable','^mdDataTableRow'], - link: function($scope, element, attrs, ctrl, transclude){ - var mdDataTableRowCtrl = ctrl[1]; - - transclude(function (clone) { - //TODO: rework, figure out something for including html content - if($scope.htmlContent){ - mdDataTableRowCtrl.addToRowDataStorage(clone, 'htmlContent'); - }else{ - //TODO: better idea? - var cellValue = $parse(clone.html().replace('{{', '').replace('}}', ''))($scope.$parent); - mdDataTableRowCtrl.addToRowDataStorage(cellValue); - } - }); - } - }; - } - mdDataTableCellDirective.$inject = ['$parse']; - - angular - .module('mdDataTable') - .directive('mdDataTableCell', mdDataTableCellDirective); -}()); -(function(){ - 'use strict'; - - function mdDataTableRowDirective(IndexTrackerFactory){ - return { - restrict: 'E', - transclude: true, - require: '^mdDataTable', - scope: { - tableRowId: '=' - }, - controller: ['$scope', function($scope){ - var vm = this; - - vm.addToRowDataStorage = addToRowDataStorage; - $scope.rowDataStorage = []; - - initIndexTrackerServiceAndBindMethods(); - - function initIndexTrackerServiceAndBindMethods(){ - var indexHelperService = IndexTrackerFactory.getInstance(); - - vm.increaseIndex = _.bind(indexHelperService.increaseIndex, indexHelperService); - vm.getIndex = _.bind(indexHelperService.getIndex, indexHelperService); - } - - function addToRowDataStorage(value, contentType){ - if(contentType === 'htmlContent'){ - $scope.rowDataStorage.push({value: value, type: 'html'}); - }else{ - $scope.rowDataStorage.push(value); - } - } - }], - link: function($scope, element, attrs, ctrl, transclude){ - appendColumns(); - - ctrl.addRowData($scope.tableRowId, $scope.rowDataStorage); - //ctrl.increaseIndex(); - - function appendColumns(){ - transclude(function (clone) { - element.append(clone); - }); - } - } - }; - } - mdDataTableRowDirective.$inject = ['IndexTrackerFactory']; - - angular - .module('mdDataTable') - .directive('mdDataTableRow', mdDataTableRowDirective); }()); \ No newline at end of file