Clever Geek Handbook

How to translate header column in Slickgrids

I recently started working with slickgrids. So you have many, many doubts. How can column headings be stacked in slickgrids

+3


source to share


3 answers


I solved it by editing 2 css tags:

In slick-default-theme.css

:

.slick-header-columns {
    white-space: pre !important;
    height: 45px;
}

height

here is customizable according to your needs. It was okay to display 3 lines.



The slick.grid.css

change the settings height

in the tag below 100%

:

.slick-header-column.ui-state-default {
    ...
    height: 100%;
    ...
}

Hope this helps!

+4


source


fwiw, the author of smooth grid answers this question here: https://github.com/mleibman/SlickGrid/issues/61



+4


source


I created my own css class to enable / disable the feature:

.slickgrid-word-wrap .slick-cell {
    white-space: normal;
    overflow: auto;
}

And then in the container div

:

<div id="my-grid"
     class="slickgrid-word-wrap"></div>

And you can set the row height in the SlickGrid config like this:

var options = {
            editable: false,
            enableCellNavigation: false,
            autoExpandColumns: false,
            forceFitColumns: false,
            showFooterRow: false,
            explicitInitialization: true,
            multiColumnSort: false,
            rowHeight: 50 // <--- here
        };
0


source






More articles:


All Articles