Skip to content

Commit 783fefb

Browse files
committed
fix(Header): Hidden header height misplacement
A hidden header caused the scrollbar and viewport to be drawn lower and smaller than they should have been. Fixes #1995 BREAKING CHANGE: The `hideHeader` option has been changed to `showHeader` To migrate, change your code from the following: `hideHeader: true` To: `showHeader: false`
1 parent 0991d20 commit 783fefb

File tree

4 files changed

+24
-17
lines changed

4 files changed

+24
-17
lines changed

src/js/core/directives/ui-grid-header.js

+3-10
Original file line numberDiff line numberDiff line change
@@ -24,19 +24,12 @@
2424

2525
containerCtrl.header = $elm;
2626
containerCtrl.colContainer.header = $elm;
27-
28-
/**
29-
* @ngdoc property
30-
* @name hideHeader
31-
* @propertyOf ui.grid.class:GridOptions
32-
* @description Null by default. When set to true, this setting will replace the
33-
* standard header template with '<div></div>', resulting in no header being shown.
34-
*/
3527

3628
var headerTemplate;
37-
if ($scope.grid.options.hideHeader){
29+
if (!$scope.grid.options.showHeader) {
3830
headerTemplate = emptyTemplate;
39-
} else {
31+
}
32+
else {
4033
headerTemplate = ($scope.grid.options.headerTemplate) ? $scope.grid.options.headerTemplate : defaultTemplate;
4134
}
4235

src/js/core/directives/ui-grid.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -217,7 +217,7 @@ angular.module('ui.grid').directive('uiGrid',
217217
if (grid.gridHeight < grid.options.rowHeight) {
218218
// Figure out the new height
219219
var contentHeight = grid.options.minRowsToShow * grid.options.rowHeight;
220-
var headerHeight = grid.options.hideHeader ? 0 : grid.options.headerRowHeight;
220+
var headerHeight = grid.options.showHeader ? grid.options.headerRowHeight : 0;
221221
var footerHeight = grid.options.showFooter ? grid.options.footerRowHeight : 0;
222222
var scrollbarHeight = grid.options.enableScrollbars ? gridUtil.getScrollbarWidth() : 0;
223223

src/js/core/factories/GridOptions.js

+13-4
Original file line numberDiff line numberDiff line change
@@ -128,17 +128,26 @@ angular.module('ui.grid')
128128
baseOptions.getRowIdentity = baseOptions.getRowIdentity || function getRowIdentity(row) {
129129
return row.$$hashKey;
130130
};
131-
131+
132+
/**
133+
* @ngdoc property
134+
* @name showHeader
135+
* @propertyOf ui.grid.class:GridOptions
136+
* @description True by default. When set to false, this setting will replace the
137+
* standard header template with '<div></div>', resulting in no header being shown.
138+
*
139+
* It will also set the `headerRowHeight` option to 0.
140+
*/
141+
baseOptions.showHeader = typeof(baseOptions.showHeader) !== "undefined" ? baseOptions.showHeader : true;
142+
132143
/**
133144
* @ngdoc property
134145
* @name headerRowHeight
135146
* @propertyOf ui.grid.class:GridOptions
136147
* @description The height of the header in pixels, defaults to 30
137148
*
138149
*/
139-
baseOptions.headerRowHeight = typeof(baseOptions.headerRowHeight) !== "undefined" ? baseOptions.headerRowHeight : 30;
140-
141-
if (baseOptions.hideHeader){
150+
if (!baseOptions.showHeader) {
142151
baseOptions.headerRowHeight = 0;
143152
}
144153
else {

test/unit/core/factories/GridOptions.spec.js

+7-2
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ describe('GridOptions factory', function () {
2323
rowHeight: 30,
2424
maxVisibleRowCount: 200,
2525
minRowsToShow: 10,
26+
showHeader: true,
2627
showFooter: false,
2728
footerRowHeight: 30,
2829
columnWidth: 50,
@@ -61,6 +62,7 @@ describe('GridOptions factory', function () {
6162
rowHeight: 40,
6263
maxVisibleRowCount: 20,
6364
minRowsToShow: 15,
65+
showHeader: true,
6466
showFooter: true,
6567
footerRowHeight: 50,
6668
columnWidth: 60,
@@ -96,6 +98,7 @@ describe('GridOptions factory', function () {
9698
rowHeight: 40,
9799
maxVisibleRowCount: 20,
98100
minRowsToShow: 15,
101+
showHeader: true,
99102
showFooter: true,
100103
footerRowHeight: 50,
101104
columnWidth: 60,
@@ -135,6 +138,7 @@ describe('GridOptions factory', function () {
135138
rowHeight: 40,
136139
maxVisibleRowCount: 20,
137140
minRowsToShow: 15,
141+
showHeader: false,
138142
showFooter: false,
139143
footerRowHeight: 50,
140144
columnWidth: 60,
@@ -146,8 +150,8 @@ describe('GridOptions factory', function () {
146150
excessColumns: 7,
147151
horizontalScrollThreshold: 3,
148152
scrollThrottle: 75,
149-
enableSorting: false,
150153
enableFiltering: false,
154+
enableSorting: false,
151155
enableColumnMenus: false,
152156
enableVerticalScrollbar: 0,
153157
enableHorizontalScrollbar: 0,
@@ -166,10 +170,11 @@ describe('GridOptions factory', function () {
166170
enableRowHashing: false,
167171
rowIdentity: testFunction,
168172
getRowIdentity: testFunction,
169-
headerRowHeight: 40,
173+
headerRowHeight: 0, // Because of showHeader: false
170174
rowHeight: 40,
171175
maxVisibleRowCount: 20,
172176
minRowsToShow: 15,
177+
showHeader: false,
173178
showFooter: false,
174179
footerRowHeight: 50,
175180
columnWidth: 60,

0 commit comments

Comments
 (0)