CODEWITHSUNDEEP
cssangularjsng-grid
David Karlsson
David Karlsson

Reputation: 9696

angular ng-grid maxWidth not used

I am trying to create some autosizing properties for an angular ng-grid element:

       for (var i = 0; i < $scope.dates.length; i++) {
            var dateElement = {
                field: 'reportMap.' + $scope.dates[i] + '.hours | round',
                displayName: i + 1,
                minWidth: "27px",
                maxWidth: "46px"

            };

            if ($scope.holidays.indexOf(i + 1) != -1) {
                dateElement.cellTemplate = 'app/partials/gridCell.html';
            }
            $scope.columns.push(dateElement);

.....

          $scope.gridOptions = {
                data: 'monthlyReports',
                columnDefs: 'columns',
                plugins: [new ngGridFlexibleHeightPlugin()],
                enableRowSelection: false,
                enableColumnResize: true,
                enableSorting: false,
                enableCellSelection: true
            };

However, when the field data gets longer than 4 characters the content is hidden. I.e. the width is not increased. I could be using width: "auto" but i need to limit the sizing of th columns somewhat...

Why is the column width not increased when the conent gets longer than 27px?

This is what i get setting the width to auto for my date elements:

enter image description here

This is what i want, dynamic width depending on content! (i also want less padding around the number and the left and right sides of the cell, see the wide cell)

enter image description here

Upvotes: 1

Views: 1470

Answers (1)

David Karlsson
David Karlsson

Reputation: 9696

Ovveriding the cell properties did the trick in this case, just increasing the constant width one pixel to 28px and overriding the padding made it look good.

ngCellText {padding: 2px; text-align: center;}

Upvotes: 0

Related Questions