2012-02-14 24 views
6

グリッドを使用すると、並べ替えはインライン編集モードでいくつかの行を持ちながら行われます。jqGridの行をインラインで編集中に列を並べ替える問題

質問は次のようになります。インラインは1つまたは複数の行を編集しながら

  1. は、ソートを実行する方法は、ありますか?

  2. ない場合は、インラインは1つ以上の行を編集しているとき、私は列のヘッダーをクリックするとジャンプしますイベント?(私は多分内容をソートする前に、編集を削除することができますイベント)

があります

ありがとう、Catalin

答えて

7

興味深い質問!私の+1。

編集行またはセルのソートに関する問題は、編集セルの包含へのアクセスにあります。 jqGridの現在のコードではこれが行われないので、列ヘッダーのclickイベントハンドラー内で、グリッドに編集行があるかどうかテストされます。いくつかの編集行/行が存在する場合、並べ替えはなしで停止し、onSortColコールバックを呼び出します。

ソート前に編集セルを保存または復元できる2番目の方法のみです。これを実装するには小さな問題が1つあります。追加のclickイベントを列ヘッダーにバインドすると、の後にの前にバインドされたjqGridの標準ハンドラーが呼び出されます。だから、の編集を保存したり破棄したりすることはできません。の前にクリックイベントが処理されます。問題は2つの方法で解決できます。新しいイベントハンドラからsortData関数を呼び出すか、またはclickイベントへのバインディングの順序を変更する必要があります。

$.each($grid[0].grid.headers, function() { 
    var $th = $(this.el), i, l, clickHandler, clickHandlers = [], 
     currentHandlers = $th.data('events'), 
     clickBinding = currentHandlers.click; 

    if ($.isArray(clickBinding)) { 
     for (i = 0, l = clickBinding.length; i < l; i++) { 
      clickHandler = clickBinding[i].handler; 
      clickHandlers.push(clickHandler); 
      $th.unbind('click', clickHandler); 
     } 
    } 
    $th.click(function() { 
     var p = $grid[0].p, savedRow = p.savedRow, j, len = savedRow.length; 
     if (len > 0) { 
      // there are rows in cell editing or inline editing 
      if (p.cellEdit) { 
       // savedRow has the form {id:iRow, ic:iCol, name:nm, v:value} 
       // we can call restoreCell or saveCell 
       //$grid.jqGrid("restoreCell", savedRow[0].id, savedRow[0].ic); 
       $grid.jqGrid("saveCell", savedRow[0].id, savedRow[0].ic); 
      } else { 
       // inline editing 
       for (j = len - 1; j >= 0; j--) { 
        // call restoreRow or saveRow 
        //$grid.jqGrid("restoreRow", savedRow[j].id); 
        $grid.jqGrid("saveRow", savedRow[j].id); 
       } 
      } 
     } 
    }); 
    l = clickHandlers.length; 
    if (l > 0) { 
     for (i = 0; i < l; i++) { 
      $th.bind('click', clickHandlers[i]); 
     } 
    } 
}); 

$gridvar $grid = $("#list")ように定義される:次のコードは、第二のアプローチを実証します。あなたはそれがどのように働くのかをthe following demoで見ることができます。

+0

ありがとう、私はそれを試してみましょう –

+0

作品は素晴らしいです。再度、感謝します。 –

+0

@CatalinForea:ようこそ! – Oleg

1

オプション2を試したい場合は、onSortColイベントにフックすることができます。そこでは、すべての行の編集モードをキャンセルし、ソートを実行できるようにすることができます。 "stop"を返さないようにしてください。そうしないと並べ替えがまったく行われません。

ソート可能な列がクリックされた直後およびデータをソートする前に発生します。

すべてのドキュメントはhereです。

+0

すでに試しました。グリッド行の編集中は起動しません。 –

関連する問題