Jquery JQGrid – 如何设置网格标题单元格的对齐方式?

前端之家收集整理的这篇文章主要介绍了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.

请注意,它说“不在标题单元格”。我如何做这个标题单元格(网格标题单元格)?文档没有提到这个细节….

解决方法

更改列标题对齐方式的最佳记录方法是使用jqGrid的setLabel方法(参见 http://www.trirand.com/jqgridwiki/doku.php?id=wiki:methods)。

您可以使用以下代码更改由’name’标识的列的对齐方式:’Name’

grid.jqGrid ('setLabel','Name','',{'text-align':'right'});

代码

grid.jqGrid ('setLabel','Product Name',{'text-align':'right'},{'title':'My ToolTip for the product name column header'});

您可以将标题名称更改为“产品名称”,并为产品名称标题设置“我的工具提示”作为相应列标题的工具提示

您还可以在CSS中定义一些类,并针对setLabel方法为列标题设置它。

顺便说一句,选择函数“setLabel”的名称是因为您无法定义jqGrid的colNames参数,而是在colModel中使用额外的“label”选项来定义一个列标题,而不是“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','textalignright');
grid.jqGrid ('setLabel','Description','textalignleft');

(我定义5px作为填充,以更好地看到结果。您可以选择填充值,您会发现在您的情况下更好)。

原文链接:https://www.f2er.com/jquery/183313.html

猜你在找的jQuery相关文章