Skip to content

Commit 2dd1688

Browse files
marcelo-portugalmportuga
authored andcommitted
feat: 🎸 the ability to disable hide columns on a grid level
Setting enableHiding to false in gridOptions will remove the ability to hide columns by default on all columns, unless explicitly enabled in the column definition. Closes: #1604
1 parent 373ef59 commit 2dd1688

File tree

7 files changed

+73
-12
lines changed

7 files changed

+73
-12
lines changed

‎misc/tutorial/121_grid_menu.ngdoc

+2-1
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,9 @@ want them also internationalized in the grid menu. The translate needs to retur
3030
or a promise that will resolve to a string. In the example below we create a fake
3131
internationalization function that waits 1 second then prefixes each column with "col: ".
3232

33-
You can suppress the ability to show and hide columns by setting the gridOption `gridMenuShowHideColumns: false`,
33+
You can suppress the ability to show and hide columns on the grid menu button by setting the gridOption `gridMenuShowHideColumns: false`,
3434
you can suppress the ability to hide individual columns by setting `enableHiding` on that columnDef to false.
35+
you can suppress the ability to hide all columns by setting `enableHiding` on that gridOptions to false.
3536

3637
The gridMenu button is still a bit ugly. If you have the skills to do so we'd welcome a PR that makes it pretty.
3738
In the meantime, you can override the height to fit with your application in your css:

‎packages/core/src/js/directives/ui-grid-column-menu.js

+10-2
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,9 @@ function ( i18nService, uiGridConstants, gridUtil ) {
6464
$scope.$on( '$destroy', deregFunction );
6565
},
6666

67+
getGridOption: function( $scope, option ) {
68+
return typeof($scope.grid) !== 'undefined' && $scope.grid && $scope.grid.options && $scope.grid.options[option];
69+
},
6770

6871
/**
6972
* @ngdoc boolean
@@ -81,7 +84,7 @@ function ( i18nService, uiGridConstants, gridUtil ) {
8184
*
8285
*/
8386
sortable: function( $scope ) {
84-
return Boolean( $scope.grid.options.enableSorting && typeof($scope.col) !== 'undefined' && $scope.col && $scope.col.enableSorting);
87+
return Boolean( this.getGridOption($scope, 'enableSorting') && typeof($scope.col) !== 'undefined' && $scope.col && $scope.col.enableSorting);
8588
},
8689

8790
/**
@@ -128,7 +131,12 @@ function ( i18nService, uiGridConstants, gridUtil ) {
128131
*
129132
*/
130133
hideable: function( $scope ) {
131-
return !(typeof($scope.col) !== 'undefined' && $scope.col && $scope.col.colDef && $scope.col.colDef.enableHiding === false );
134+
return Boolean(
135+
(this.getGridOption($scope, 'enableHiding') &&
136+
typeof($scope.col) !== 'undefined' && $scope.col &&
137+
($scope.col.colDef && $scope.col.colDef.enableHiding !== false || !$scope.col.colDef)) ||
138+
(!this.getGridOption($scope, 'enableHiding') && $scope.col && $scope.col.colDef && $scope.col.colDef.enableHiding)
139+
);
132140
},
133141

134142

‎packages/core/src/js/directives/ui-grid-menu-button.js

+11-8
Original file line numberDiff line numberDiff line change
@@ -258,17 +258,10 @@ angular.module('ui.grid')
258258
return isColumnVisible(colDef) ? 'ui-grid-icon-ok' : 'ui-grid-icon-cancel';
259259
}
260260

261-
// add header for columns
262-
showHideColumns.push({
263-
title: i18nService.getSafeText('gridMenu.columns'),
264-
order: 300,
265-
templateUrl: 'ui-grid/ui-grid-menu-header-item'
266-
});
267-
268261
$scope.grid.options.gridMenuTitleFilter = $scope.grid.options.gridMenuTitleFilter ? $scope.grid.options.gridMenuTitleFilter : function( title ) { return title; };
269262

270263
$scope.grid.options.columnDefs.forEach( function( colDef, index ) {
271-
if ( colDef.enableHiding !== false ) {
264+
if ( $scope.grid.options.enableHiding !== false && colDef.enableHiding !== false || colDef.enableHiding ) {
272265
// add hide menu item - shows an OK icon as we only show when column is already visible
273266
var menuItem = {
274267
icon: getColumnIcon(colDef),
@@ -297,6 +290,16 @@ angular.module('ui.grid')
297290
showHideColumns.push( menuItem );
298291
}
299292
});
293+
294+
// add header for columns
295+
if ( showHideColumns.length ) {
296+
showHideColumns.unshift({
297+
title: i18nService.getSafeText('gridMenu.columns'),
298+
order: 300,
299+
templateUrl: 'ui-grid/ui-grid-menu-header-item'
300+
});
301+
}
302+
300303
return showHideColumns;
301304
},
302305

‎packages/core/src/js/factories/GridOptions.js

+11
Original file line numberDiff line numberDiff line change
@@ -366,6 +366,17 @@ angular.module('ui.grid')
366366
*/
367367
baseOptions.scrollDebounce = typeof(baseOptions.scrollDebounce) !== "undefined" ? baseOptions.scrollDebounce : 300;
368368

369+
/**
370+
* @ngdoc boolean
371+
* @name enableHiding
372+
* @propertyOf ui.grid.class:GridOptions
373+
* @description True by default. When enabled, this setting adds ability to hide
374+
* the column headers, allowing hiding of the column from the grid.
375+
* Column hiding can then be disabled / enabled on individual columns using the columnDefs,
376+
* if it set, it will override GridOptions enableHiding setting.
377+
*/
378+
baseOptions.enableHiding = baseOptions.enableHiding !== false;
379+
369380
/**
370381
* @ngdoc boolean
371382
* @name enableSorting

‎packages/core/test/core/directives/ui-grid-column-menu.spec.js

+16
Original file line numberDiff line numberDiff line change
@@ -196,14 +196,30 @@ describe('ui-grid-column-menu uiGridColumnMenuService', function() {
196196
});
197197

198198
describe('hideable: ', function() {
199+
it('grid.options missing', function() {
200+
$scope.col = {uid: 'ui-grid-01x', enableHiding: true};
201+
$scope.grid = {options: {}};
202+
203+
expect(uiGridColumnMenuService.hideable($scope)).toEqual(false);
204+
});
205+
199206
it('everything present: is not hideable', function() {
200207
$scope.col = {uid: 'ui-grid-01x', colDef: {enableHiding: false}};
208+
$scope.grid = {options: {enableHiding: true}};
201209

202210
expect(uiGridColumnMenuService.hideable($scope)).toEqual(false);
203211
});
204212

213+
it('everything present: is hideable', function() {
214+
$scope.col = {uid: 'ui-grid-01x', colDef: {enableHiding: true}};
215+
$scope.grid = {options: {enableHiding: false}};
216+
217+
expect(uiGridColumnMenuService.hideable($scope)).toEqual(true);
218+
});
219+
205220
it('colDef missing: is hideable', function() {
206221
$scope.col = {uid: 'ui-grid-01x'};
222+
$scope.grid = {options: {enableHiding: true}};
207223

208224
expect(uiGridColumnMenuService.hideable($scope)).toEqual(true);
209225
});

‎packages/core/test/core/directives/ui-grid-menu-button.spec.js

+18-1
Original file line numberDiff line numberDiff line change
@@ -255,7 +255,7 @@ describe('ui-grid-menu-button uiGridGridMenuService', function() {
255255
});
256256
$scope.$digest();
257257

258-
expect(menuItems.length).toEqual(6, 'Should be 10 items, 1 columns header, 4 columns that allow hiding and Clean all filters');
258+
expect(menuItems.length).toEqual(6, 'Should be 6 items, 1 columns header, 4 columns that allow hiding and Clean all filters');
259259
expect(menuItems[0].title).toEqual('Clear all filters', 'Menu item 0 should be Clear all filters');
260260
expect(menuItems[1].title).toEqual('Columns:', 'Menu item 0 should be header');
261261
expect(menuItems[1].templateUrl).toEqual('ui-grid/ui-grid-menu-header-item');
@@ -264,6 +264,23 @@ describe('ui-grid-menu-button uiGridGridMenuService', function() {
264264
expect(menuItems[4].title).toEqual('resolve_2', 'Promise now resolved');
265265
expect(menuItems[5].title).toEqual('resolve_3', 'Promise now resolved');
266266
});
267+
it('should not add any columns if enableHiding if false and not enable on any columns', function() {
268+
grid.options.enableHiding = false;
269+
menuItems = uiGridGridMenuService.getMenuItems($scope);
270+
271+
expect(menuItems.length).toEqual(1, 'Should be 1 items, the clear all filters button');
272+
expect(menuItems[0].title).toEqual('Clear all filters', 'Menu item 0 should be Clear all filters');
273+
});
274+
it('should add any columns if enableHiding if false, but enabled on one columns', function() {
275+
grid.options.enableHiding = false;
276+
grid.options.columnDefs[1].enableHiding = true;
277+
menuItems = uiGridGridMenuService.getMenuItems($scope);
278+
279+
expect(menuItems.length).toEqual(3, 'Should be 3 items, 1 columns header, 1 columns that allow hiding and Clean all filters');
280+
expect(menuItems[1].title).toEqual('Columns:', 'Menu item 0 should be header');
281+
expect(menuItems[1].templateUrl).toEqual('ui-grid/ui-grid-menu-header-item');
282+
expect(menuItems[2].title).toEqual('Col2', 'Column heading');
283+
});
267284
});
268285

269286
describe('showHideColumns: ', function() {

‎packages/core/test/core/factories/GridOptions.spec.js

+5
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ describe('GridOptions factory', function () {
3838
aggregationCalcThrottle: 500,
3939
wheelScrollThrottle: 70,
4040
scrollDebounce: 300,
41+
enableHiding: true,
4142
enableSorting: true,
4243
enableFiltering: false,
4344
filterContainer: 'headerCell',
@@ -86,6 +87,7 @@ describe('GridOptions factory', function () {
8687
excessColumns: 7,
8788
aggregationCalcThrottle: 1000,
8889
wheelScrollThrottle: 75,
90+
enableHiding: true,
8991
enableSorting: true,
9092
enableFiltering: true,
9193
filterContainer: 'columnMenu',
@@ -132,6 +134,7 @@ describe('GridOptions factory', function () {
132134
aggregationCalcThrottle: 1000,
133135
wheelScrollThrottle: 75,
134136
scrollDebounce: 300,
137+
enableHiding: true,
135138
enableSorting: true,
136139
enableFiltering: true,
137140
filterContainer: 'columnMenu',
@@ -183,6 +186,7 @@ describe('GridOptions factory', function () {
183186
wheelScrollThrottle: 75,
184187
enableFiltering: false,
185188
filterContainer: 'columnMenu',
189+
enableHiding: false,
186190
enableSorting: false,
187191
enableColumnMenus: false,
188192
enableVerticalScrollbar: 0,
@@ -226,6 +230,7 @@ describe('GridOptions factory', function () {
226230
aggregationCalcThrottle: 1000,
227231
wheelScrollThrottle: 75,
228232
scrollDebounce: 300,
233+
enableHiding: false,
229234
enableSorting: false,
230235
enableFiltering: false,
231236
filterContainer: 'columnMenu',

0 commit comments

Comments
 (0)