一部のデータを含む JQgrid があり、ツールバーの検索オプションが有効になっています。最後の文字が入力されてから 2 秒または 3 秒後にトリガーするか、ユーザーが Enter キーを押したときにトリガーするようにツールバーに指示する方法があるかどうかを知りたいです。ドキュメント wiki を検索しても結果は得られませんでした。何か案が?
2 に答える
searchOnEnter: false
使用オプション (こちらを参照)の場合に使用される jqGrid のコードを調べると、タイムアウトを管理するオプションが表示されず、その後、検索が自動的に開始されます。タイムアウトは常に 500ms (0.5 秒) です。したがって、別のタイムアウトが必要な場合は、カスタム コードに同じ動作を実装する必要があります。keydown
オプション doと同じことを行う独自のハンドラーを登録できますsearchOnEnter: false
が、別のタイムアウトがあります。例えば
var $grid = $("#grid"), hTimeout;
$grid.jqGrid('filterToolbar', {defaultSearch: "cn", stringResult: true});
$grid.closest(".ui-jqgrid-view")
.find(">.ui-jqgrid-hdiv .ui-search-toolbar th input")
.keydown(function (e) {
var uiKeyCode = $.ui.keyCode,
keyCode = e.keyCode || e.which;
if (keyCode === uiKeyCode.ENTER) {
return false;
}
if (keyCode === uiKeyCode.PAGE_UP || keyCode === uiKeyCode.PAGE_DOWN ||
keyCode === uiKeyCode.END || keyCode === uiKeyCode.HOME ||
keyCode === uiKeyCode.UP || keyCode === uiKeyCode.DOWN ||
keyCode === uiKeyCode.LEFT || keyCode === uiKeyCode.RIGHT) {
return;
}
if (hTimeout) {
clearTimeout(hTimeout);
}
hTimeout = setTimeout(function () {
$grid[0].triggerToolbar();
hTimeout = undefined;
}, 3000); // start searching with 3 sec timeout
});
デモを参照してください。
colModel 内で、searchoptions をカスタム関数の例に設定できます。
searchoptions: {dataInit: function (elem) { AutoOrAfterEnterSearch(elem) }} ...
次に、イベント ハンドラーを作成して、一定期間後または Enter キーが押されたときに検索をトリガーすることができます Ex if (e.keyCode == 13) { SearchFunction() };
、キーを押すたびに、タイマーもリセットする必要があります。これはソリューションの完全なコードではありませんが、これは正しいパスである必要があります。私は個人的にこれを使用して、検索ツールバーのオートコンプリートを構築します (これは、時間指定検索よりも優れている可能性があります)。