2017-08-17 30 views
0

グリッドを静的にしようとしています。まったく動きません。GridStack-静的グリッドを設定する

私が試した:

var options = { 
     staticGrid: true, 
    }; 
    $('.grid-stack').gridstack(options); 

もこの

var options = { 
     setStatic: true, 
    }; 
    $('.grid-stack').gridstack(options); 

をし、それらのこの

var options = { 
     staticGrid: true, 
    }; 
    $('.grid-stack').gridstack(options); 
    $('.grid-stack').data('gridstack').setStatic(true); 

どれも動いていないようにみえ、私はドキュメントのために、このlinkを使用。

彼らはまた、方法setStaticを述べたが、この方法を使用する例はない。

答えて

0

Gridstack docsによると、staticGrid:trueパラメータは、開始時にSTATICとしてグリッドを初期化して定義する場合(最初の方法)は正しいです。

SetStatic(true)は、プログラムでこの状態を切り替えるために呼び出すことができる関数です。

ソースコードをライブ表示すると、新しいCSSクラスがグリッドラッパーDIVに追加されていることがわかります。 'grid-stack-static'というクラスです。このクラスの外観は、パラメータオプションstaticGrid:trueが承認され、処理されたことを確認します。

私は自分自身(ライブラリのv0.30で)を見つけたので、初期化されたグリッド内のグリッドウィジェットはサイズ変更可能で移動可能です。私の意見では、これはバグを示唆しています。

は商品を使用してウィジェットアイテムレベルでの動きとリサイズをロックダウンすることができますが "はい" = データ-GS-NO-サイズ変更= "yes" をデータ-GS-NO-移動属性ありません。

すでに '静的'と言われている場合は、これを行う必要があります。

私はGithubの問題を報告しました。

ところで、setStatic(true)関数をgrid initの後に呼び出して使用することが推奨されています。このバグの一時的な修正として。あなたの3番目の方法でした - これは私のために働いた。

第3の方法と私の違いは、関数がdocument.ready関数でラップされていることです(システムでの利便性と互換性のために$ = jqueryショートカットを使用しています)。

が働い:あなたがグリッドを入れ子にしている場合、これは動作しません

(function ($) { 
 
    // Shortcut $=jquery 
 

 
    $(document).ready(function() { 
 
     // start grid 
 

 
     $(function() { 
 
     var options = { 
 
      staticGrid:true 
 
      }; 
 
     $('.grid-stack').gridstack(options); 
 

 
     $('.grid-stack').data('gridstack').setStatic(true); 
 
     }); 
 

 
    // END DOC READY 
 
    }); 
 
// SHORTCUT FIX 
 
})(jQuery);

+0

。 – Kamran

+0

@Kamran回避策は内部グリッドでも動作します。各グリッドグループ構成クラス名に対してAPIコールsetStatic(true)を繰り返します。すなわち$( '。grid-inner')。data( 'gridstack')。setStatic(true); –

関連する問題