私はjqGridを初めて使用しますが、速く学習しています...
ローカルデータでjqGridを使用しています。特定のオブジェクトの状態を示しており、それらはリアルタイムで変更されています。コメットベースのAPIを介して状態の変更を受け取ります。これらの変更では、テーブルの行を追加/変更/削除する必要があります。データは、非表示の「sortorder」列でソートされたままにする必要があります。これにより、静的な並べ替え順序が簡単になると思います。
したがって、「data」パラメータを使用せず、データを「ロード」せず、一度に1行ずつ追加します。
私は各挿入を行うことを考えています。各挿入の後に行を並べ替えるか、テーブルのデータの項目を最後まで繰り返すか、(このsortorder値によって)1つよりも大きいものを見つけることができます。追加します。次に、この行の直前に新しい行を追加します。現在、これらすべてを1行目に追加しています。各オブジェクトは、次のようになっています。
jQuery("#mygrid").jqGrid('addRowData',1, obj);
見た目は素晴らしいですが、まだ正しい順序ではありません。
削除は(私が思うに)とても簡単です。私はまだそこに着いていません。
しかし、変更についてはどうですか?データの変更には「sortorder」値の変更が含まれる可能性があるため、変更のたびにデータを再利用する必要があります。この非表示の列を並べ替え列として定義し、データが変更されたら、基になるデータを変更できると思います。グリッドに行を「並べ替え」させる簡単な方法はありますか?$('#mygrid')。trigger( "reloadGrid")を試しましたが、何もしませんでした...上記の'addRowData'呼び出しで初期データをロードした後、効果がありませんでした。データは同じままでした...
私は正しい方向に進んでいますか?プログラムで行を追加したり、行を変更したり、行を削除したり、グリッドを使用して現在の並べ替えられた状態を表示したりするサンプルはありますか?
これが$(document).ready()で作成したグリッド定義です
html:<table id ='mygrid'> </ table>
jQuery("#mygrid").jqGrid({
datatype: "local",
loadonce: true,
scroll:1,
height: "auto",
width: '100%',
colNames:['A','B', 'C', 'D', 'SortKey'],
colModel:[
{name:'a',index:'a'},
{name:'b',index:'b'},
{name:'c',index:'c'},
{name:'d',index:'d'},
{name:'sortordering',index:'sortordering', hidden:true}
],
rowNum:200,
sortname: 'sortordering',
sortorder: 'asc',
shrinkToFit: true,
autowidth: true,
viewrecords: true,
multiselect: false,
imgpath: "lib/basic/images",
caption: "Testing 123"
});
グリッドは、追加したデータで見栄えがします。グリッドを並べ替えて、状態の変化を管理する必要があります...
アドバイスありがとうございます!
編集#1:私は物事を試し、何が最善かを学ぶのに忙しかった。これが私がこれまでに知っていることです:
1)$('#mygrid')。trigger( "reloadGrid")は、 "loadonce"/"local"データ用ではありません。それがあなたがしていることであるならば、それはホストからデータを取得/更新するためのものです。
2)変更後に正常に再利用できる唯一の方法は、jQuery( "#mygrid")。jqGrid('sortGrid'、 "sortordering"、false);を呼び出すことです。しかし、私はそれを2回呼び出す必要があります:-(並べ替えの各呼び出しは、列をクリックしたかのように方向(昇順または降順)を切り替えます。「sortGrid」呼び出しで方向を指定する方法はありません-私の追加パラメーターである必要があります意見...
3)データを変更するには、jQuery( "#mygrid")。jqGrid('setRowData'、...);を使用する必要があります。そしておそらくその後に頼る
4)データを削除するには、jQuery( "#mygrid")。jqGrid('delRowData'、...);を使用する必要があります。
私の次のタスクは、変更したい行のrowIDを見つける正しい方法を見つけることです。できれば、それらすべてを繰り返すことなく、それを実行する必要があります...
編集#2:rowIDの重要性を理解しました。これは、非常に役立ちます。ここで説明するように、rowID値としても機能する列値を指定できます(一意である方がよいです)。これにより、後でその行を簡単に参照できます...したがって、新しい情報が到着したときに、編集(setRowData)または削除(delRowData)のいずれかで、この列の値をsetRowDataまたはdelRowDataのrowIDパラメーターとして渡し、次にオブジェクト全体(新しいデータとして)を渡すと、すべて設定されます。この「キー」をグリッドに表示したくない場合は、単に非表示にします。この列を非表示として、colModel仕様のrowIDとして指定するには(primarykeyをデータ内の属性名に変更します):
{name:'primarykey',index:'primarykey', key: true, hidden:true}
余談ですが、上記の例では、昨日「sortordering」列をキーとして使用してみましたが、これは常に一意ですが、実際には時間の経過とともに変化する可能性があるため、キーの適切な候補にはなりません。true属性。