Кто-нибудь знает, как обернуть имена столбцов в JQGrid. Пожалуйста, найдите мой код JSON ниже
colModel: [ {name: 'RequestID', index: 'CreditRequest.CreditRequestID', ширина: 100, align: 'left'},.....
В отношении вышеуказанного кода, если размер содержимого превышает, я хочу, чтобы он был завернут. Любые мысли или комментарии
Ну, самый простой способ обеспечить разрыв строки - поместить тег <BR/> в имя столбца, где вам понадобится разрыв строки. Например, ClientPrimaryName может быть записано как Client<BR/>PrimaryName, так что оно фактически отображается как:
Клиент
PrimaryName
Просто укажите его в своем собственном файле css.
.ui-jqgrid tr.jqgrow td {
height: 50px;
white-space: normal;
}
Пока ваш файл css указан в заголовке после файла jqGrid.css, он будет переопределять его.
Для чего это стоит, вот он для строки заголовка:
.ui-jqgrid .ui-jqgrid-htable th div, .ui-jqgrid-sortable {
height:auto;
overflow:hidden;
white-space:normal !important;
}
Вам нужно взглянуть на конкретные классы, применяемые к заголовкам столбцов jqGrid th. В моем случае у меня было следующее: ui-th-div-ie ui-jqgrid-sortable
Посмотрев немного дальше, я обнаружил, что были две проблемы с CSS:
Оба этих атрибута CSS, которые определены в файле ui.jqgrid.css. Понимая, что у меня есть особые требования к этой сетке, которые я не хотел влиять на другие реализации, я придумал следующее решение:
$(".ui-jqgrid-sortable").css('white-space', 'normal');
$(".ui-jqgrid-sortable").css('height', 'auto');
Вот несколько шагов, чтобы включить перенос слов в ячейках.
Откройте ui.jqgrid.css Поиск .ui-jqgrid tr.jqgrow td Изменить "white-space: pre"; на "white-space: normal;"
Для переноса в ячейку:
.ui-jqgrid tr.jqgrow td {
white-space: normal !important;
height:auto;
vertical-align:text-top;
padding-top:2px;
}
И для заголовков столбцов
.ui-jqgrid .ui-jqgrid-htable th div {
height:auto;
overflow:hidden;
padding-right:4px;
padding-top:2px;
position:relative;
vertical-align:text-top;
white-space:normal !important;
}
Вы можете установить свойство css белого пробела для тэга в нормальное состояние. Использование JQuery, который должен быть:
$('.ui-jqgrid .ui-jqgrid-htable th div').css('white-space', 'normal');
Используйте этот css
.ui-jqgrid tr.jqgrow td {
word-wrap: break-word; /* IE 5.5+ and CSS3 */
white-space: pre-wrap; /* CSS3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
overflow: hidden;
height: auto;
vertical-align: middle;
padding-top: 3px;
padding-bottom: 3px
}
вы не можете просто положить <BR/>, в то время как это работает для обертывания строки - оно не правильно регулирует высоту
Это работало с jqGrid 4.4.4
.ui-jqgrid .ui-jqgrid-htable th div
{
white-space:normal;
height:auto !important;
}