移動行

Question

後、私がどのように見える3列のグリッド持ってグリッドに行を取得jqgrid：私はそれが可能にユーザーがマウスを使って、グリッド内のsortoderを変えることができると判断

col1  col2 col_sortorder 
AAAA  1000 1 
AAAA  1002 2 
AAAA  1003 3 

を。

col1  col2 col_sortorder 
AAAA  1002 2 
AAAA  1000 1 
AAAA  1003 3 

私はこれを達成：グリッドがどのように見えるので、例えば、上に2行目に移動

jQuery("#list").jqGrid('sortableRows'); 
jQuery("#list").bind('sortstop', function() { fun_sort(event) }); 

今私はcol_sortorderの新しい値と私のデータベースを更新します。 関数fun_sort（）は、sortstop-eventによって正しくトリガーされます。 私の意図は、単にグリッドからすべてのデータを読み込み、col_sortorderの新しい値としてforloopインデックスを使用していたが、私は使用して私のグリッドを読んだとき：

var allRowsInGrid = $('#list').jqGrid('getGridParam','data'); 
for (i = 0 ; i <= allRowsInGrid.length -1; i++){ 
var col1 = allRowsInGrid[i].col1; 
var col2 = allRowsInGrid[i].col1; 
var col_sortorder = i+1; //new value for sortorder 
// call ajax to update the database 
} 

機能getGridParamは常に初期を返します。私はグリッド内の行を移動した後に、順序ではなくグリッドの順序。 誰かが私にこれをどのようにすることができるか教えてもらえますか？

Answer 1

あなたの質問が面白いので、デモhttps://jsfiddle.net/OlegKi/xw0gcjez/を作成しました。このデモでは、問題をどのように解決できるかを示しています。 sortableRowsのupdateコールバックを使用しました。これは"sortupdate"イベント（the documentation参照）と同じです。 updateColSortorderが

function updateColSortorder() { 
    var rows = $grid[0].rows, localRow, i; 
    for (i = 0; i < rows.length; i++) { 
     if ($(rows[i]).hasClass("jqgrow")) { 
      // row is a row with data. row.id is the rowid 
      localRow = $grid.jqGrid("getLocalRow", rows[i].id); 
      localRow.col_sortorder = i; 
     } 
    } 
} 

グリッドです

$("#list").jqGrid("sortableRows", { 
    update: function() { 
     updateColSortorder(); 
     // the data of the column col_sortorder will contain 
     // now sequensial values 1,2,3... 
     // even the display values are still old 

     // reload grid to display updated data 
     var p = $grid.jqGrid("getGridParam"); 
     // we reset sortname to "col_sortorder" only to reload 
     // with minimal visual changes for the user 
     p.sortname = "col_sortorder"; 
     p.sortorder = "asc"; 
     setTimeout(function() { 
      $grid.trigger("reloadGrid"); 
     }, 0); 
    } 
}); 

は内部でHTMLテーブルを使用しています。従って、$grid[0]はtableのDOMであり、これはrowsの特性を有する。すべての行にはidというプロパティがあります。 rowsコレクション内の要素の順序は、行が表示される順序に対応します。