インライン編集、仮想スクロール、およびキーバインディングが有効になっている jqGrid があります。複数選択を有効にしていません(これまでの検索で結果が得られたものです)。
下矢印を押すと、グリッドの次の行が選択されます。選択した値が表示領域の下部に達すると、グリッドがスクロールして新しく選択された行に対応します。
行 40 (私の rowNum) に到達すると、下向きのキーは何もしません。次の 40 行をロードすることを半分期待していましたが、もっとよく知っておくべきだったと思います。
私の質問は、「下矢印キーを押して次の 40 レコードをロードし、グリッドに追加するにはどうすればよいですか?」というものです。
マウスのスクロール ホイールを使用するか、スクロールバーをドラッグすると正常に動作します。ただし、追加のデータを読み込むにはマウスでスクロールする必要があると言うと、ユーザーは怒り狂うでしょう。
「マウスホイールのコードを下矢印コードに差し込めないのはなぜですか?
なぜこんなに時間がかかるの!?
なぜこれを機能させることができないのですか。」
などなど
私は次の方法を知っています:
$("#grid").jqGrid('setGridParam',{page:2});
$("#grid").trigger("reloadGrid");
ただし、それらを keydown / onSelectRow イベントにプラグインする方法がわかりません。さらに、データがトリミングされた後にスクロールアップすることについて懸念があります。
ここにいくつかのグリッドコードがあります:
grid.jqGrid({
scroll: 1,
url: dataUrl,
datatype: "json",
rowNum: 40,
editurl: editUrl,
colNames: dataHelper.columnNames(),
colModel: dataHelper.columnModels(),
rownumbers: true,
rownumWidth: 30,
altrows: true,
autowidth: true,
viewrecords: true,
pager: pagerId,
sortname: "id",
sortorder: "desc",
gridview: true,
jsonReader:{repeatitems: false},
ondblClickRow: function(){
var row_id = grid.getGridParam('selrow');
$(grid).editRow(row_id, true);
},
onSelectRow: function(rowid, status, e){
var reccount = grid.getGridParam("reccount");
var page = grid.getGridParam("page");
if(****SOME CONDITION****){
grid.jqGrid('setGridParam',{page: page+1});
grid.trigger("reloadGrid");
}
}
});
grid.jqGrid('navGrid', pagerId,{edit:false,add:false,del:false, searchtext: "Search", refreshtext: "Refresh"});
grid.jqGrid("inlineNav", pagerId, {edittext: "Edit", addtext: "Add", savetext: "Save", canceltext: "Cancel", deletetext: "Delete", addParams: {position: "afterSelected"}});
grid.jqGrid("filterToolbar", {stringResult: true, searchOnEnter: true});
grid.jqGrid("bindKeys", {scrollingRows: true, onEnter: function(rowid){grid.editRow(rowid, true);}});