这里提出了这个问题。 jqGrid column not aligned with column headers
但边框右边的颜色似乎对我不起作用。
我正在使用jqGrid 3.8和IE 8
这是我对jqGrid的设置
shrinkToFit:true,
colModel :[
{name:'leid', index:'leid', width:70, label:'LEID'},
{name:'cdr', index:'cdr', width:40, label:'CDR'},
{name:'name', index:'name', width:160, label:'Name'},
{name:'country', index:'country', width:98, label:'Country'},
{name:'fc', index:'fc', width:50, label:'FC'},
{name:'bslaMe', index:'bslaMe', width:65, label:'BSLA/ME'},
{name:'business', index:'business', width:130, label:'Business'},
{name:'amtFc', index:'amtFc', width:98, label:'Amt(FC)', align:'right',
formatter:'currency', formatoptions:{decimalSeparator:".",
thousandsSeparator: ",", decimalPlaces: 2, prefix: "", suffix:"",
defaultValue: '0'} },
{name:'amtUsd', index:'amtUsd', width:98, label:'Amt(Cur)', align:'right',
formatter:'currency', formatoptions:{decimalSeparator:".",
thousandsSeparator: ",", decimalPlaces: 2, prefix: "", suffix:"",
defaultValue: '0'} },
{name:'cashPoolHeader', index:'cashPoolHeader', width:120,
label:'Cash Pool Header'},
{name:'cashPoolCDR', index:'cashPoolCDR', width:60, label:'CP CDR'},
{name:'cashPoolName', index:'cashPoolName', width:160, label:'Cash Pool Name'}
],
有什么想法吗？
答案 0 :(得分：6)
我遇到了同样的问题，我通过在gridComplete中附加4行代码解决了这个问题，这4行会改变内容区td的样式[第一行{{ 1}}的样式修改就足够了]。
这是jqgid中的一个问题，它实际上是在td内设置了td，但这种风格并未反映在<thead>的内容区域中。在开发jqgrid时，他们假设整个列的宽度将通过改变一行的td s的宽度来实现，但它们仅针对td进行了更改，这是此处持久存在的问题。
在<thead>：
colModel在colModel: [
{
name: 'Email',
index: 'Email',
editable: true,
edittype: 'custom',
width: 220,
editoptions: {
custom_element: function(value, options) {
return EmailAddressCustomElement(value, options);
},
custom_value: function(elem) {
var inputs = $("input", $(elem)[0]);
return inputs[0].value;
}
}
},
{
name: 'LocationAndRole',
index: 'LocationAndRole',
editable: true,
align: "left",
edittype: "button",
width: 170,
editoptions: {
value: 'Edit Location And Role',
dataEvents: [{
type: 'click',
fn: function(e) {
ShowUsersLocationAndRoles(e);
}
}]
}
}
]
事件中添加以下代码：
gridComplete我希望上面的代码可以帮助您解决问题。
答案 1 :(得分：0)
查看我的old answer，其中介绍了如何更改列标题对齐方式。
它不是你想要的，那么你应该张贴一张显示网格外观的图片，并在你的问题中添加网格的完整代码，包括HTML代码，有关你使用的jqGrid版本的信息以及测试数据。所以你需要重现你的问题。
答案 2 :(得分：0)
上面的代码对我不起作用
我稍微改了一下： 4.6.0正常工作
var objHeader = $("table[aria-labelledby=gbox_" + gridName+ "] tr[role=rowheader] th");
for (var i = 0; i < objHeader.length; i++) {
var col = $("table[id=" + gridName+ "] td[aria-describedby=" + objHeader[i].id + "]");
var width= col.outerWidth();
$(objHeader[i]).css("width", width);
}
答案 3 :(得分：0)
我知道它很旧，但是今天在处理旧版应用程序时遇到了相同的问题（4.5.1版本），@ Zecarro的解决方案对我有所帮助。我必须修改脚本以设置列宽而不是标题宽度，以使其正常运行。
var objHeader = $("table[aria-labelledby=gbox_" + gridName+ "] tr[role=rowheader] th");
for (var i = 0; i < objHeader.length; i++) {
var col = $("table[id=" + gridName+ "] td[aria-describedby=" + objHeader[i].id + "]");
var width= col.outerWidth();
var headerWidth = $(objHeader [i]).width();
col.width(headerWidth);
}
答案 4 :(得分：0)
就我而言，
function alignColumnsWithHeaders(gridName) {
//alert("giriyor");
var objTableDiv = $("div[id=gview_" + gridName + "]");
var tableLength = objTableDiv.width();
var objHeader = $("table[aria-labelledby=gbox_" + gridName + "] tr[class=jqg- first-row-header] th");
var columnLength = tableLength / objHeader.length;
columnLength = Math.floor(columnLength);
for (var i = 0; i < objHeader.length; i++) {
objHeader[i].style.width = columnLength.toString() + "px";
}
}