jquery - 如何将 jqgrid 列与列标题对齐？

Question

我在列/列标题对齐方面遇到了很多麻烦。

jqgrid 的图像:

如上图所示，我的第一列的宽度比列标题的宽度大。如果我将列标题宽度设置为更大的数字，列单元格宽度也会增加。我一直在尝试打开和关闭 shrinkToFit、向第一列单元格添加类以及设置“max-widht”和“width”等操作，但没有奏效。

jqgrid 应该有第一列填充员工姓名，其余列代表一个月中的几天。一个月中的几天将由几个字母填充并为其背景着色，或者留空。

这是我的代码

$(document).ready(function () {
$("#tabs").tabs();

var ColModel1 = [];
ColModel1.push({ name: 'EMPLEADOS', label:'Empleados', index: 'EMPLEADOS',    align:'left', width:185    });
for (var i = 1; i < 32; i++) {
    ColModel1.push({ name: 'DIA_' + i, label: i, index: 'DIA_' + i, align: 'left', width: 27
    });
}
ConstruyeGridVacaciones(ColModel1);
});

function ConstruyeGridVacaciones(ColModel1) {
$("#GridMaestroVacaciones").jqGrid({
    datatype: 'local',
    altRows: true,
    altclass: 'jqgrid-altrow',
    rowNum: 1000,
    //scrollOffset: 0,
    shrinkToFit: false,
    height: 645,
    hidegrid: false,
    caption: "Vacaciones",
    width: 1180,
    colModel: ColModel1,
    pager: '#PaginadorGridMaestroMonedas',
    imgpath: '../shared/themes/basic/images',
    viewrecords: true,
    sortorder: 'asc',
});

var datos = {'EMPLEADOS':'1'};
for (var i = 1; i < 32; i++) {
    var key ='DIA_'+i;
    datos[key] = i;
}

$('#GridMaestroVacaciones').jqGrid('addRowData', '1', datos, 'last');

$('#GridMaestroVacaciones').jqGrid('addRowData', '2', datos, 'last');

$('#GridMaestroVacaciones').jqGrid('addRowData', '3', datos, 'last');

$('#GridMaestroVacaciones').jqGrid('addRowData', '4', datos, 'last');

$(".jqgrow td").first().addClass("ancho");
}

Answer 1

可以使用 setLabel 方法对齐标题。您可以使用以下代码更改 say 'empleados': 'empleados' 列的对齐方式:

grid.jqGrid ('setLabel', 'empleados', '', {'text-align':'center'});

希望它有用。