如何在标题中添加单独的列以在jqgrid中进行垂直滚动

Question

当jqgrid具有超过50条记录时，行列与标题列未正确对齐。

如何在标题中添加额外的列以在jqgrid中垂直滚动，如下图所示。

示例： 在jqgrid中显示用于垂直滚动的Extra列。

在我的jqgrid中，没有用于垂直滚动的单独列，当标题大于10时，行和标题列会更改。

下面是jqgrid的图像，其中没有用于垂直滚动的标题列。

Answer 1

使用jqGrid版本4.1.1时，您可以为列添加额外的值：

colNames:['ID',
              'Etat',
              'Date',
              'Fournisseur<br/>Commande',
              'Contenu',''],

然后添加空白列定义：

  colModel:[
      {name:'ID',index:'ID',hidden:true,width:70,align:'center',sorttype: 'int'},
      {name:'ETAT',index:'ETAT',width:150,align:'center'},
      {name:'DATE',index:'DATE',width:150,align:'center',title: false},
      {name:'FOURNISSEUR_CMD',index:'FOURNISSEUR_CMD',width:200,align:'center',title: false},
      {name:'CONTENU',index:'CONTENU',width:200,align:'center',title: false},
 { name: "empty1", width: 10, sortable: false, hidedlg: true, search: false, resizable: false, fixed: true }     
    ],

然后你应该得到像这个例子的输出

在jqGrid 4.6.0版中，默认情况下，您将拥有该列，例如Fiddle Demo

Answer 2

添加padding-right: 20px; 在ui.jqgrid.css文件的css类.ui-jqgrid .ui-jqgrid-htable标题中，带有空列的标题与垂直滚动一起显示。

.ui-jqgrid .ui-jqgrid-htable {table-layout:fixed;margin:0; padding-right: 20px;}