jQueryのEasyUIデータグリッド - 行の背景色を設定した条件
このチュートリアルでは、条件の数に応じたラインスタイルデータグリッド(データグリッド)のアセンブリを変更する方法を説明します。 listprice値が50よりも大きい場合、我々は行ごとに異なる色を設定します。
rowStyler機能のデータ・グリッド(データグリッド)のために設計を使用すると、線のスタイルをカスタマイズできるようにすることです。 次のコードでは、線のスタイルを変更する方法を示しています。
<表のid = "TT"タイトル= "データグリッド"スタイル= "幅:600PX;高さ:250ピクセル" URL = "データ/ datagrid_data.json」 singleSelect = "true"をfitColumns = "真"> <THEAD> <TR> アイテムID </目> <Thのフィールドは=幅= "80" "のItemID"> <Thのフィールド= "商品コード"幅= "80">プロダクトID </目> <Thのフィールド= "listprice"幅= "80" = "右"を揃える>価格</目> <Thのフィールド= "unitcost"幅= "80"揃える= "右">単価</目> <Thのフィールド= "ATTR1"幅= "150">属性</目> <Thのフィールド= "ステータス"幅= "60" = "センター"を揃える> Stauts </目> </ TR> </ THEAD> </表>
$( '#Ttの')。データグリッド({ rowStyler:機能(インデックス、行){ 場合(row.listprice> 50){ リターン「背景色:ピンク;色:青;フォント重量:太字; '; } } });
あなたが見ることができるように、我々は、ピンク(ピンク)のためのいくつかの条件に応じて、背景色(背景色)を設定ブルー(青)へのテキストの色を設定します。