JQuery JQGrid - Как установить выравнивание ячеек заголовка сетки?
Действительно ли возможно выровнять заголовки столбцов сетки в jqgrid? например, выровняйте по левому краю право или центр?
В jqrid документах http://www.trirand.com/jqgridwiki/doku.php?id=wiki:colmodel_options это говорит:
align: Defines the alignment of the cell in the Body layer, not in header cell.
Possible values: left, center, right.
Обратите внимание, что это говорит "не в ячейке заголовка". Как я могу сделать это для ячейки заголовка (ячейка заголовка сетки)? Документации не удается упомянуть эту небольшую деталь....
2 ответа
Лучшим документированным способом изменения выравнивания заголовка столбца является использование метода setLabel jqGrid (см. http://www.trirand.com/jqgridwiki/doku.php?id=wiki:methods).
Вы можете изменить выравнивание столбца, обозначенного 'name': 'Name', с помощью следующего кода:
grid.jqGrid ('setLabel', 'Name', '', {'text-align':'right'});
С помощью кода
grid.jqGrid ('setLabel', 'Name', 'Product Name', {'text-align':'right'},
{'title':'My ToolTip for the product name column header'});
вы можете изменить название заголовка на 'Product Name' и установить 'My ToolTip for the product name column header' в качестве подсказки для соответствующего заголовка столбца.
Вы также можете определить некоторые классы в вашем CSS и установить их для заголовков колонок также с помощью метода setLabel.
Кстати, название функции 'setLabel' выбрано потому, что вы не можете определить colNames параметр jqGrid, а используете дополнительную опцию 'label' в colModel для определения заголовка колонки, отличного от 'name' значения.
UPDATED: Вы можете использовать классы для определения 'text-align' или 'padding'. Просто попробуйте следующие
.textalignright { text-align:right !important; }
.textalignleft { text-align:left !important; }
.textalignright div { padding-right: 5px; }
.textalignleft div { padding-left: 5px; }
и
grid.jqGrid ('setLabel', 'Name', '', 'textalignright');
grid.jqGrid ('setLabel', 'Description', '', 'textalignleft');
(я задал 5px в качестве padding, чтобы лучше видеть результаты. Вы можете выбрать значение padding, которое будет лучше в вашем случае).
Просто зайдите в свой файл css в jqgrid.
Найдите:
ui-th-column,.ui-jqgrid .ui-jqgrid-htable th.ui-th-column
{overflow:hidden;white-space:nowrap;text-align:center; ...
И измените выравнивание текста.
Я не нашел его с обычными опциями.
Надеюсь, это вам поможет.
Бруно