Обтекание текстовых строк в JqGrid

Ответ 1

Попробуйте использовать следующий 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;"';
}

Ответ 2

С 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

Ответ 3

У меня была эта проблема для заголовков, и мне было нужно все это, чтобы заставить ее также исправить ее в 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;  
}

Ответ 4

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

классы

строка

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

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