Question

我想为我的JQgrid显示一个水平滚动条，但它没有显示出来。这是我的网格代码

    jQuery("#list").jqGrid({
url:'failReportFeeder.jsp?rep=fic&rid=1&deskId=RATES&ctlSelectedDate='+document.getElementById('ctlSelectedDate').value,
datatype: 'json',
colNames: ['Trader', 'Transaction Date', 'As of Trade Date', 'Settlement Date', 'Security Name', 'Cusip Numbers', 'Receive Deliver Type', 'Calc Fail Amount', 'Calculable Transaction Price', 'Principal', 'Accrued Interest',  'Trade Money', 'Accrued Interest To Date', 'External TRade Id', 'Group Customer Account Number', 'Group Customer Name',  'Outstanding Date', 'Customer Account', 'Salesperson Code', 'Depository Account', 'Comment', 'Customer Name', 'ISIN Code', 'Aging'],
colModel: [
{name: 'trader', index: 'trader', width: 200, sorttype: 'text', align: 'center', search:true, stype:'text'},
{name: 'trdate', index: 'trdate', width: 200, sorttype: 'text', align: 'center',search:true, stype:'text'},
{name: 'aotd', index: 'aotd', width: 200, align: 'center', sorttype: 'text',search:true, stype:'text'},
{name: 'stdt', index: 'stdt', width: 200, align: 'center', sorttype: 'text',search:true, stype:'text'},
{name: 'secn', index: 'mval', width: 200, align: 'right', sorttype: 'float',search:true, stype:'text'},
{name: 'csp', index: 'csp', width: 200, sorttype: 'text', align: 'center', search:true, stype:'text'},
{name: 'rdt', index: 'rdt', width: 200, sorttype: 'text', align: 'center',search:true, stype:'text'},
{name: 'cfa', index: 'cfa', width: 200, align: 'center', sorttype: 'text',search:true, stype:'text'},
{name: 'ctp', index: 'ctp', width: 100, align: 'center', sorttype: 'text',search:true, stype:'text'},
{name: 'prin', index: 'prin', width: 100, align: 'right', sorttype: 'float',search:true, stype:'text'},
{name: 'acin', index: 'acin', width: 100, sorttype: 'text', align: 'center', search:true, stype:'text'},
{name: 'trm', index: 'trm', width: 100, sorttype: 'text', align: 'center',search:true, stype:'text'},
{name: 'aitd', index: 'aitd', width: 100, align: 'center', sorttype: 'text',search:true, stype:'text'},
{name: 'etri', index: 'etri', width: 100, align: 'center', sorttype: 'text',search:true, stype:'text'},
{name: 'gcan', index: 'gcan', width: 100, align: 'right', sorttype: 'float',search:true, stype:'text'},
{name: 'gcn', index: 'gcn', width: 100, sorttype: 'text', align: 'center', search:true, stype:'text'},
{name: 'otd', index: 'otd', width: 100, sorttype: 'text', align: 'center',search:true, stype:'text'},
{name: 'csa', index: 'csa', width: 100, align: 'center', sorttype: 'text',search:true, stype:'text'},
{name: 'slc', index: 'slc', width: 100, align: 'center', sorttype: 'text',search:true, stype:'text'},
{name: 'dpa', index: 'dpa', width: 100, align: 'right', sorttype: 'float',search:true, stype:'text'},
{name: 'cmt', index: 'cmt', width: 100, sorttype: 'text', align: 'center',search:true, stype:'text'},
{name: 'cstn', index: 'cstn', width: 100, align: 'center', sorttype: 'text',search:true, stype:'text'},
{name: 'isin', index: 'isin', width: 100, align: 'center', sorttype: 'text',search:true, stype:'text'},
{name: 'agn', index: 'agn', width: 100, align: 'right', sorttype: 'float',search:true, stype:'text'}
   ],
pager: "#pager",
rowNum: 500,
rowList: [500,1000, 2000, 3000,4000],
sortorder: "desc",
viewrecords: true,
gridview: true,
autoencode: false,
height:475,
multiSort:true,
shrinkToFit:false,
multiselect:false,
ignoreCase:true,
autowidth: true,
loadonce:true,
caption:" Rates Desk Report"}).navGrid('#pager',{edit:false,add:false,del:false,search:true,refresh:true}).jqGrid('navButtonAdd',
'#pager',
{ caption: " Export to Excel ",
 position: "first",
 onClickButton: function(){
jQuery("#list").jqGrid('excelExport',
{
"url":"xlsxreporter.jsp?AppName=FailsReports&deskId=RATES&reportId=1&reportType=fic&BSNS_DT="+ document.getElementById('ctlSelectedDate').value
 });
}
});
$('#list').setGridWidth(1050, true);

请指教。我已经收缩了假和自动宽度为真。如果我取出$（'＃list'）。setGridWidth（1050，true）;选项，然后水平滚动条显示，但然后我的网格超出网页的边界。我需要以某种方式修改网格cs吗？

Answer 1

这是同一个问题：How to show horizontal scroll bar in jqgrid

没有任何代码，您需要查看一些内容......

不要使用autowidth并确保您没有使用shrinkToFit（它   需要设置为false）。除此之外，水平滚动条   应该只出现这两个变化。除此之外，你   还应确保为每列明确设置宽度   在列模型中。

Answer 2

Found the answer here

jqGrid and the autowidth option. How does it work?

the priority for jqgrid frame width is *jqgrid frame autowidth > jqgrid frame width > sum of column width *

the priority for column width is colmodel fixed > jqgrid frame shrinkToFit > colmodel width

so i just set the fixed property in colModel to true.

fixed:true

JQgrid水平滚动条没有显示

2 个答案: