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

Question

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

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

示例： Display Extra column for vertical scrolling in jqgrid.

在我的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 }     
    ],

然后你应该获得像this example

这样的输出

使用jqGrid版本4.6.0，您将默认使用此列Fiddle Demo

Answer 2

在css class padding-right: 20px;的 ui.jqgrid.css 文件中添加.ui-jqgrid .ui-jqgrid-htable后，会显示带有空列的标题以及垂直滚动。

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