Перенос текстовых строк в JqGrid

Можете ли вы заставить строки текста обернуть JqGrid? Я осмотрелся, но ничего не нашел.


person beakersoft    schedule 13.11.2009    source источник


Ответы (4)


Попробуйте следующий CSS:

    .ui-jqgrid tr.jqgrow td {
        white-space: normal !important;
    }

У меня это работает с использованием jqGrid 3.6.


Как отметил N30, jqGrid 4.0 теперь поддерживает параметр cellattr colModel что может обеспечить более тонкий контроль над переносом текста. Из его примера:

cellattr: function (rowId, tv, rawObject, cm, rdata) { 
    return 'style="white-space: normal;"';
}
person Justin Ethier    schedule 13.11.2009

В jQGrid 4.0 лучший способ сделать это - использовать cellattr в colmodel следующим образом: -

colModel: [
            { name: 'ClientName', label: 'Client', index: 'ClientName', width: 150, cellattr: function (rowId, tv, rawObject, cm, rdata) { return 'style="white-space: normal;"' } },

            .... other columns

            ]

Таким образом, вы можете применить стиль переноса к отдельному столбцу и не использовать! Important

person N30    schedule 16.06.2011

У меня была эта проблема с заголовками, и я обнаружил, что мне нужно все это, чтобы исправить это и в IE. Обратите внимание, что это касается заголовков, а не ячеек. Проблема в том, что это, вероятно, влияет больше, чем вы могли бы захотеть (я уверен, что обнаружу позже), но вы всегда можете уточнить селекторы css и / или сделать так, чтобы они ссылались на конкретный #tableIdName или какой-либо класс, чтобы вы могли подпишитесь как хотите.

.ui-jqgrid .ui-jqgrid-htable th div {
overflow: visible !important;
height: auto !important;
}

.ui-th-column, .ui-jqgrid .ui-jqgrid-htable th.ui-th-column {
  white-space: normal !important;  
}

.ui-jqgrid .ui-th-div-ie{
  white-space: normal !important;  
}
person AaronLS    schedule 18.04.2012

Вы можете использовать параметр классы colModel, чтобы поместить класс CSS в свой столбец, а затем поместите в свой файл CSS стиль white-space: normal !important; для этого класса ...

классы

нить

Эта опция позволяет добавлять классы в столбец. Если будет использоваться более одного класса, следует установить пробел. Например, classes:'class1 class2' установит class1 и class2 для каждой ячейки в этом столбце.

В CSS-сетке есть предопределенный класс ui-ellipsis, который позволяет прикрепить многоточие к определенной строке. Также это будет работать и в FireFox.

person lmcarreiro    schedule 26.07.2016