Angular ui-grid header chopped

Question

This is what I got:

While menu button is a bit taller than normal, header is chopped into half.

HTML:

<style type="text/css">
        .TreeCCS {width: 900px; height: 250px;}
    </style>
<div ng-controller="ctrlMyTree">
            <br />ANGULAR
            <div id="afad" ui-grid="grdMyTree" ui-grid-tree-view class="TreeCCS">
            </div>
        </div>

.js:

var aIS = angular.module("app", ["ui.grid", "ui.grid.treeView"]);
aIS.controller("ctrlMyTree", function ($scope, $http)
{
    $scope.grdMyTree= { enableGridMenu: true, showTreeExpandNoChildren: true, enableTreeView: true, };

Node and leaf levels are not defined yet, following this official tutorial but using dynamic json to load data. Works if Take out all tree-related.

ui.grid.js = 3.2.9. What am I missing here?

Plunker

Jeb50
– Jeb50

2017-02-17 19:28:18 +00:00
Commented Feb 17, 2017 at 19:28 — Jeb50
– Jeb50, Commented Feb 17, 2017 at 19:28

Jeb50 · Accepted Answer · 2017-02-17 22:19:40Z

0

The key is showTreeExpandNoChildren, should be false rather than true(default). Although not documented,

showTreeExpandNoChildren: defaults to true. Shows the + sign even if there are no children, allows you to dynamically load children. If set to false there'll be no + if there are no children.

Here,

answered Feb 17, 2017 at 22:19

Jeb50

7,13711 gold badges70 silver badges118 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular ui-grid header chopped

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related