1. ホーム
  2. javascript

[解決済み] ブラウザサイズ変更時にjqGridをリサイズしますか?

2023-07-10 16:15:35

質問

をリサイズする方法はありますか? jqGrid のサイズを変更する方法はありますか?私は、説明されている方法を試してみました。 ここで を試してみましたが、この方法はIE7ではうまくいきません。

解決方法は?

フォローアップとして

この投稿で示された以前のコードは、信頼性が低いため、最終的に放棄されました。私は現在、jqGrid のドキュメントで推奨されているように、グリッドのサイズを変更するために次の API 関数を使用しています。

jQuery("#targetGrid").setGridWidth(width);

実際のリサイズを行うために、以下のロジックを実装した関数がウィンドウのリサイズイベントにバインドされます。

  • 親のclientWidthと(それが利用できない場合)そのoffsetWidth属性を使用して、グリッドの幅を計算します。

  • 幅が x ピクセル以上変更されたことを確認するためにサニティ チェックを実行します (いくつかのアプリケーション固有の問題を回避するため)。

  • 最後に、グリッドの幅を変更するためにsetGridWidth()を使用します。

以下は、リサイズを処理するためのコード例です。

jQuery(window).bind('resize', function() {

    // Get width of parent container
    var width = jQuery(targetContainer).attr('clientWidth');
    if (width == null || width < 1){
        // For IE, revert to offsetWidth if necessary
        width = jQuery(targetContainer).attr('offsetWidth');
    }
    width = width - 2; // Fudge factor to prevent horizontal scrollbars
    if (width > 0 &&
        // Only resize if new width exceeds a minimal threshold
        // Fixes IE issue with in-place resizing when mousing-over frame bars
        Math.abs(width - jQuery(targetGrid).width()) > 5)
    {
        jQuery(targetGrid).setGridWidth(width);
    }

}).trigger('resize');

そしてマークアップ例。

<div id="grid_container">
    <table id="grid"></table>
    <div id="grid_pgr"></div>
</div>