diff --git a/src/js/core/directives/ui-grid-menu-button.js b/src/js/core/directives/ui-grid-menu-button.js index f14b6b3c0a..1bf1f6836a 100644 --- a/src/js/core/directives/ui-grid-menu-button.js +++ b/src/js/core/directives/ui-grid-menu-button.js @@ -257,7 +257,8 @@ angular.module('ui.grid') // add header for columns showHideColumns.push({ title: i18nService.getSafeText('gridMenu.columns'), - order: 300 + order: 300, + templateUrl: 'ui-grid/ui-grid-menu-header-item' }); $scope.grid.options.gridMenuTitleFilter = $scope.grid.options.gridMenuTitleFilter ? $scope.grid.options.gridMenuTitleFilter : function( title ) { return title; }; diff --git a/src/js/core/directives/ui-grid-menu.js b/src/js/core/directives/ui-grid-menu.js index 72ff63a154..5c580f16b4 100644 --- a/src/js/core/directives/ui-grid-menu.js +++ b/src/js/core/directives/ui-grid-menu.js @@ -220,7 +220,7 @@ function ($compile, $timeout, $window, $document, gridUtil, uiGridConstants, i18 }]) .directive('uiGridMenuItem', ['gridUtil', '$compile', 'i18nService', function (gridUtil, $compile, i18nService) { - var uiGridMenuItem = { + return { priority: 0, scope: { name: '=', @@ -321,8 +321,6 @@ function ($compile, $timeout, $window, $document, gridUtil, uiGridConstants, i18 }; } }; - - return uiGridMenuItem; }]); })(); diff --git a/src/less/menu.less b/src/less/menu.less index 2bb2225679..e31228c059 100644 --- a/src/less/menu.less +++ b/src/less/menu.less @@ -57,14 +57,18 @@ list-style-type: none; li { - padding: 0px; - button { + padding: 0; + .ui-grid-menu-item { color: @menuTextColor; min-width: 100%; padding: 8px; text-align: left; background: transparent; border: none; + cursor: default; + } + button.ui-grid-menu-item { + cursor: pointer; // Show a shadow when hovering over a menu item &:hover, @@ -78,7 +82,7 @@ } // Show a bottom border on all but the last menu item - li:not(:last-child) > button { + li:not(:last-child) > .ui-grid-menu-item { border-bottom: @gridBorderWidth solid @borderColor; } } diff --git a/src/templates/ui-grid/ui-grid-menu-header-item.html b/src/templates/ui-grid/ui-grid-menu-header-item.html new file mode 100644 index 0000000000..d878f0fa21 --- /dev/null +++ b/src/templates/ui-grid/ui-grid-menu-header-item.html @@ -0,0 +1,12 @@ +
  • +
    + + +
    +
  • \ No newline at end of file diff --git a/test/unit/core/directives/ui-grid-menu-button.spec.js b/test/unit/core/directives/ui-grid-menu-button.spec.js index 5fd2e56ba6..8da9d0906a 100644 --- a/test/unit/core/directives/ui-grid-menu-button.spec.js +++ b/test/unit/core/directives/ui-grid-menu-button.spec.js @@ -219,6 +219,7 @@ describe('ui-grid-menu-button uiGridGridMenuService', function() { expect(menuItems[4].title).toEqual('Clear all filters', 'Menu item 4 Clear all filters'); expect(menuItems[5].title).toEqual('Columns:', 'Menu item 5 should be header'); + expect(menuItems[5].templateUrl).toEqual('ui-grid/ui-grid-menu-header-item'); expect(menuItems[6].title.toLowerCase()).toEqual('fn_col1', 'Menu item 5 should be col1'); expect(menuItems[7].title.toLowerCase()).toEqual('fn_col3', 'Menu item 6 should be col3'); expect(menuItems[8].title.toLowerCase()).toEqual('fn_col4', 'Menu item 7 should be col4'); @@ -243,6 +244,7 @@ describe('ui-grid-menu-button uiGridGridMenuService', function() { expect(menuItems.length).toEqual(6, 'Should be 6 items, 1 columns header, 4 columns that allow hiding and clear all filters'); expect(menuItems[0].title).toEqual('Clear all filters', 'Menu item 0 should be Clear all filters'); expect(menuItems[1].title).toEqual('Columns:', 'Menu item 1 should be header'); + expect(menuItems[1].templateUrl).toEqual('ui-grid/ui-grid-menu-header-item'); expect(menuItems[2].title).toEqual('', 'Promise not resolved'); expect(menuItems[3].title).toEqual('', 'Promise not resolved'); expect(menuItems[4].title).toEqual('', 'Promise not resolved'); @@ -256,6 +258,7 @@ describe('ui-grid-menu-button uiGridGridMenuService', function() { expect(menuItems.length).toEqual(6, 'Should be 10 items, 1 columns header, 4 columns that allow hiding and Clean all filters'); expect(menuItems[0].title).toEqual('Clear all filters', 'Menu item 0 should be Clear all filters'); expect(menuItems[1].title).toEqual('Columns:', 'Menu item 0 should be header'); + expect(menuItems[1].templateUrl).toEqual('ui-grid/ui-grid-menu-header-item'); expect(menuItems[2].title).toEqual('resolve_0', 'Promise now resolved'); expect(menuItems[3].title).toEqual('resolve_1', 'Promise now resolved'); expect(menuItems[4].title).toEqual('resolve_2', 'Promise now resolved');