Baoyun Chen
Baoyun Chen

Reputation: 281

ui-grid column header menu not showing

enter image description here

As the photo shows, the column menu is not shown.

Here is my setting of the grid:

angular.module('app.ReportCtrl',['ngSanitize','ngTouch','ngCsv','ui.grid.grouping','ui.grid','ui.grid.autoResize','ui.grid.resizeColumns', 'ui.grid.moveColumns', 'reportFilters', 'reportDirectives', 'ui.bootstrap','ui.sortable'])
.controller('ReportCtrl',function($http, uiGridConstants,uiGridGroupingConstants,$rootScope, $scope, $filter, $timeout, PropertyService, EventService, SearchService, FormService, DatabaseService, ReportService, $location, $locale, EventColors, $modal, $q){

$scope.gridOptions = {
        data: 'queryResult',
        enableSorting: true,
        showColumnFooter: true,
        enableColumnResize : true,

    };

html:

<div id="table" class="gridStyle" ui-grid='gridOptions'  ui-grid-auto-resize ui-grid-grouping ui-grid-resize-columns ui-grid-move-columns></div>    

Update when I click the button I get an error:

Error: [$compile:ctreq] Controller 'ngModel', required by directive 'ngFocus', can't be found!

Update When I click the button, there is no item in menuitem. enter image description here

Did I miss anything?

Upvotes: 0

Views: 1832

Answers (2)

Baoyun Chen
Baoyun Chen

Reputation: 281

The problem was somehow ng-Focus doesn't like one/some of my other plug-ins and I could not find out which one. So I ended up deleting the ng-Focus/ng-Blur in the menuItem template in ui-grid.js and it works for me.

Not sure whether it is a good solution or not..

Upvotes: 1

SakthiSureshAnand
SakthiSureshAnand

Reputation: 1362

Could you Please add the columnDefs like eg,

$scope.gridOptions = {
    enableSorting: true,
    columnDefs: [
      { field: 'cost', enableColumnMenu: true }
      ]};

Please go through this linkhttp://ui-grid.info/docs/#/tutorial/101_intro it has all concepts related to ui-grid with example's.

Upvotes: 0

Related Questions