2009-04-20 23 views
6

jqGrid(jquery grid http://www.trirand.com/blog/)ではカスタムセルテキストの色を使用できますか?価格の列で私は価格が> 100 $と緑の場合は赤が欲しい< 50 $ else grey?カスタムセルの色を使用したjqGrid

は、より一般的

  1. jqGridは、グリッドcellview、例えばを変更するためにフックを提供してい私は価格列のセルが作成または変更されたときにコールバックを登録することができます。

  2. または別のモデルとビュー(クライアント側)を持つことが可能です サーバから私は表示する方法、すなわち各列のための2つのデータを送信することができ、どのような

編集を表示する。ので、ここでのセル値に基づいて色サンプルフォーマッタを示す一例である

function infractionInFormatter(el, cellval, opts) 
{ 
    $(el).html(cellval).css('color',infraction_color_map[cellval]); 
} 

colModel :[ 
    ... 
    {name:'date', index:'date', width:120, date:true}, 
    {name:'inf_out', index:'inf_out', width:60, formatter:infractionInFormatter,}, 
    ... 
], 

答えて

8

はい、できます。 custom formatterと記入してください。これは、colModelでの参照を渡す関数に過ぎません。関数の最終的なセルセレクタへの参照が得られますので、jQueryでできることは何でも、フォーマッタで実行できます。色/スタイルを変更することを含む。

-1

セルにxxx値がある場合は赤色の背景色を設定し、値がyyyの場合は緑色の背景色を設定します。あなたの例のように

..... 
colModel:[ 
    {name:'id',index:'id', width:15,hidden:true, align:"center"}, 
    {name:'title',index:'title', width:150, align:"center"}, 
    {name:'start',index:'start', width:350, align:"center", sorttype:"date"}, 
    {name:'fine',index:'fine', width:350, align:"center", sorttype:"date"}, 
    {name:'completed',index:'completed', width:120, align:"center",formatter:infractionInFormatter},   
    ], 
..... 

そして、この機能::私はそれを設定する必要がどのように

function infractionInFormatter(el, cellval, opts) 
     { 
      ..... 
     } 

私はこのコードを書いていますか?

ありがとうございます。

+1

これは、すべての答えではありません。質問したい場合は[ここ](http://stackoverflow.com/questions/ask)に進んでください。 – FastTrack

2

またcolModelでクラスを指定することができます。

colModel: [ 
      { 
      name:'field_x', 
      index:'field_x', 
      align: 'left', 
      width: 35, 
      classes: 'cvteste' 
      }, 
      ..... 
      ] 
関連する問題