如何在標題中添加單獨的列以在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;}