jqgrid - jqgridの最後の列のサイズを変更します

Question

jqgridにバグがあり、最後の列のサイズを変更できないようです。

これは2009年に提起されたかなり古い問題のようです。調べてみると、最新のjqGridサンプルにこの問題があるようです...しかし、最後の列をドラッグしてグリッド自体のサイズを変更できることがわかりました。ここを参照してください3.6の新機能のセクションに移動します。これがすでに修正されている場合のポインタ。

Answer 1

解決策を見つけたようです。最後の列のサイズ変更は、ヘッダー ラッパー (div.ui-jqgrid-hbox) の領域内でのみ実行できます。宇宙空間のサイズ変更プロセスでフォーカスが失われます。デフォルトの 20 ピクセルのパディング ライト領域が存在するため、この小さな部分でのみサイズを大きくすることができます。また、テーブル ラッパーの影響を一時的にキャンセルする必要があります。これは、サイズ変更プロセスも停止させるためです。

これが私の解決策です。あなたのテーブルラッパーIDは次のとおりだと思いますgbox_DataTable_u：

1: CSS: 新しいワイド パディング エリアを定義します。

.ui-jqgrid .ui-jqgrid-hbox {float: left; padding-right: 10000px;}

2: 2 つのイベントをグリッドに追加します。

resizeStart:function(event, index){ $('#gbox_DataTable_u').width($('#gbox_DataTable_u').outerWidth() + 10000);}

resizeStop: function(width, index) {$('#gbox_DataTable_u').width($('#DataTable_u').outerWidth());}

作業テーブルの例: http://www.design.atplogic.co.il/aman/philips/users.htm#

Answer 2

「RTLサポート」の例では右からサイズを変更する必要がありますが、私にとっても問題なくサイズ変更されていますが、これは理にかなっているようです。

また、Chrome を使用している場合、水平スクロール バーが表示される jqGrid のバグがあることに注意してください - jqgrid-does-not-render-correctly-in-chrome-chrome-frame を参照してください。この問題はその後解決されましたが、デモ ページはまだ更新されていません。そして、最後の列のサイズを変更する前に右端までスクロールする必要があるため、最後の列のサイズ変更が機能していないように見えます。

Answer 3

After 2 days of struggling...I finally found a way to work around. It seems that jqGrid calculates the resizing object in the dragMove event, where it uses passed event object to get the position of mouse and calculates the new width of resizing column. However when dragging exceeds the grid's boundry, the dragMove event stop shooting... So my work around is simply modifying jqGrid to calculates resizing object again in the dragEnd event. Here's the modified code

first find the dragEnd event.

...
dragEnd: function(e) { // add a new input parameter
this.hDiv.style.cursor = "default";
if(this.resizing) {
    this.dragMove(e); // call dragMove event to calculate resize object 
...

then find the mouseup event where dragEvent is triggerd...

...
$(document).mouseup(function (e) { //  get the event object
if(grid.resizing) { grid.dragEnd(e); return false;}// pass event to dragEnv
    return true;
});
...

Then columns should be able to resize to wherever mouse points.
Hope this would help.