Question

我可以在cellattr中更改列宽吗？我试过这个：

cellattr: function(rowId, value, rowObject, colModel, arrData) {
        return ' style= width: 100% !important; ';
    }

但没有变化。我没有在colModel中放置宽度并将宽度放在cellattr中，似乎网格默认为最大宽度，因此列中的文本被切割。

Answer 1

cellattr可用于指定列的单个单元格（<td>元素）的属性。列的宽度是所有单元格的公共宽度。但是，如果您需要将样式属性分配给列的所有单元格，则应在代码中使用引号：

cellattr: function () {
    return ' style="width: 100% !important;"';
}

如果您这样做，您会看到style="width: 100% !important;"属性将分配给该列的所有<td>元素。我仍然不确定它会跟随你期望的结果。

Answer 2

在th:eq(2)这里 2 表示destination column增加列header / cell宽度。 eq比较从0开始。这里我提到了增加标题和单元格宽度的第三列（2）。

要更改Column Header jqgrid宽度，请使用以下

$（'。ui-jqgrid-labels＆gt; th：eq（2）'）。css（'width'，'400px'）
要更改Column cells jqgrid宽度，请使用以下

<强> $（'＃gridId TR '）发现（ “TD：当量（2）”）的每个（函数（）{$（本）的CSS（' 宽度”， '400像素'）;}）

完成示例：

$(document).ready(function(){
            //jqGrid
            $("#usersList").jqGrid({
                url:'<%=request.getContextPath() %>/Admin/getUsersList',
                datatype: "json",               
                colNames:['Edit','Primary Email','Active','First Name','Middle Name','LastName','Mobile Number'],
                colModel:[
                    {name:'userId',search:false,index:'userId',width:30,sortable: false,formatter: editLink},                       
                    {name:'email',index:'user.primaryEmail',width:150},
                    {name:'isActive',index:'user.isActive',width:80},
                    {name:'firstName',index:'firstName', width:100},
                    {name:'middleName',index:'middleName', width:100},
                    {name:'lastName',index:'lastName', width:100},
                    {name:'mobileNo',index:'user.mobileNo', width:100},
                    ],
                    rowNum:20,
                    rowList:[10,20,30,40,50],
                    rownumbers: true,  
                    pager: '#pagerDiv',
                    sortname: 'user.primaryEmail',  
                    viewrecords: true,  
                    sortorder: "asc",

            });
            $('#gridContainer div:not(.ui-jqgrid-titlebar)').width("100%");
            $('.ui-jqgrid-bdiv').css('height', window.innerHeight * .65);
            $('#load_usersList').width("130");
            $("#usersList").jqGrid('navGrid','#pagerDiv',{edit:false,add:false,del:false},{},{},{}, {closeAfterSearch:true});
            $(".inline").colorbox({inline:true, width:"20%"});

            $('.ui-jqgrid-labels > th:eq(2)').css('width','400px');
            $('#usersList tr').find("td:eq(2)").each(function(){$(this).css('width','400px');});
        });

        function editLink(cellValue, options, rowdata, action)
        {
            return "<a href='<%=request.getContextPath()%>/Admin/editUser/" + rowdata.userId + "' class='ui-icon ui-icon-pencil' ></a>";
        }

我可以在jqgrid中更改cellattr中的列宽吗？

2 个答案: