1

jqgridの高度な検索ダイアログウィンドウのサイズと位置は、マウスで変更できます。

それらの変更は記憶されません。次回開くと、デフォルトのサイズと位置が表示されます。

おそらくローカルストレージを使用して、それを保存および復元する方法。また、リソースを再配置する前に、画面の解像度またはサイズが変更された場合に検索ダイアログの一部が表示されることを確認する必要があります。

アップデート

以下のコードを使用して、Olegの回答を拡張してウィンドウの位置を保存/復元しようとしました。検索ウィンドウは、最初とは異なる位置に復元されます。以下のコードを使用して削除された左と上の値が間違っているようです。位置を元に戻す方法も？

var oldJqDnRstop, searchParams = { width: 550, left: 5, top: 5 };
if ($.jqDnR) {
    oldJqDnRstop = $.jqDnR.stop; // save original function
    $.jqDnR.stop = function (e) {
        var $dialog = $(e.target).parent(), dialogId = $dialog.attr("id");
        oldJqDnRstop.call(this, e); // call original function
        if (typeof dialogId === "string" && dialogId.substr(0, 14) === "searchmodfbox_") {
            // save the dialog position here
            // we save "width" option as the property of searchParams object
            // used as parameter of navGrid
            searchParams.width = $dialog.width();
            searchParams.left  = $dialog.offset().left;
            searchParams.top  = $dialog.offset().top;
            saveWindowState();
        }
    };
}

Update2

Olegデモでは、ダイアログヘッダーをブラウザウィンドウの外に移動できます。その後、ダイアログは移動できなくなります。これを修正する方法は？

ここに画像の説明を入力してください

4

1 に答える 1

1

あなたの質問は面白いと思います。したがって、以下に可能な実装を示します。

質問を2つの部分に分けることができます：1）使用の場合に複数回開くときに検索ダイアログの幅をrecreateFilter: true保存する2）内部の幅を保存するlocalStorage。

localStorageすでに使用している場合、2番目の部分は比較的簡単です。保存された状態を1つの追加パラメーターで拡張する必要があります。正確な実装は、保存の実装方法に少し依存しlocalStorageます。答えの中で、私はでの保存を実装するための使用方法getItemとsetItem方法を示しました。または、IE6/IE7などの古いWebブラウザを追加でサポートする必要がある場合に非常に実用的なjStorageを使用することもできます。window.localStoragelocalStorage

そこで、使用する場合に複数回開くときに検索ダイアログの幅を節約する方法を以下に説明しますrecreateFilter: true。

$.jqDnR.stopダイアログのサイズ変更の最後に使用されるコールバックがないため、メソッドを「サブクラス化」することをお勧めします。対応するコードは次のようになります

var oldJqDnRstop, searchParams = { width: 450 };

if ($.jqDnR) {
    oldJqDnRstop = $.jqDnR.stop; // save original function
    $.jqDnR.stop = function (e) {
        var $dialog = $(e.target).parent(), dialogId = $dialog.attr("id");
        oldJqDnRstop.call(this, e); // call original function
        if (typeof dialogId === "string" && dialogId.substr(0,14) === "searchmodfbox_") {
            // save the dialog position here
            // we save "width" option as the property of searchParams object
            // used as parameter of navGrid
            searchParams.width = $dialog.width();
        }
    };
}

// create the grid
$grid.jqGrid({
    ....
});

// create navigator with "Search" button where searchParams object
// will be used as parameter
$grid.jqGrid("navGrid", "#pager", {add: false, edit: false, del: false},
    {}, {}, {}, searchParams);

ここで対応するデモを見ることができます。

更新：検索ダイアログの位置と幅を保存するには、の新しい実装のコードを$.jqDnR.stop次のように拡張する必要があります

$.jqDnR.stop = function (e) {
    var $dialog = $(e.target).parent(), dialogId = $dialog.attr("id"), position;
    oldJqDnRstop.call(this, e); // call original function
    if (typeof dialogId === "string" && dialogId.substr(0,14) === "searchmodfbox_") {
        // save the dialog position here
        searchParams.width = $dialog.width();
        position = $dialog.position();
        searchParams.left = position.left;
        searchParams.top = position.top;
    }
};

上記のコードでは、leftとtopオプションが追加で保存されます。変更されたデモはこちらです。

于 2012-12-01T19:52:05.210 に答える