ラッパーを使用するときに剣道グリッドの高さを変更するにはどうすればよいですか?
5 に答える
私はあなたが探している方法が Scrollable 構成の下にあると仮定します (高さを持たせたい場合は 1 つの Grid をスクロール可能にする必要があるためです)
.Scrollable(scr=>scr.Height(230))
高さを動的に変更するには
html 属性を削除します。
.HtmlAttributes(new { style = "height:600px;" })
auto でスクロール可能を追加します。
.Scrollable(a => a.Height("auto"))
HtmlAttributes()
<div>
ツールバー、ページング、テーブルなどを保持する に属性を追加できます。
TableHtmlAttributes()
<table>
要素だけに属性を追加できます
style 属性を追加してテーブルを 750px に設定する例:
@Html.Kendo().Grid(Model)
.Name("Grid")
.TableHtmlAttributes(new {style="height: 750px;"})
これには外部のcssルールを使用することもできます。これは、グリッドを再利用する場合に適しています(部分ビューの場合など)。スタイルまたは高さの属性を指定すると、剣道はそれらをインラインで追加するため、外部のスタイルシートでオーバーライドすることはできません。必要な場合もあれば、必要ない場合もあります。
ラッパーに提供された文字列を使用する.Name()
と、ヘッダーまたはコンテンツを対象とするcssルールを簡単に作成できます。
#GridName .k-grid-content {
height: 300px; /* internal bit with the scrollbar */
}
#GridName .k-grid-header-wrap tr {
height: 75px; /* header bar */
}
.k-grid-header-wrap
グリッドを初期化する方法によって、クラスが異なる場合があることに注意してください。また、ヘッダー内のtr
またはタグをターゲットにする必要があります。th
ヘッダー全体(通常はdivタグ)のスタイルを設定すると、一貫性のない結果になります。一部のブラウザはルールを適用しません。一部のブラウザは、実際のtr/thの境界が始まる場所に目に見えるアーティファクトを残します。
また、このアプローチにより、MVCラッパーで作成されたグリッドと通常のjsで作成されたグリッドを柔軟に切り替えることができます。または、異なるグリッド間でスタイルシートを再利用できます。