2009-11-13 116 views
50

JqGridに折り返すテキスト行を得ることができますか?私は丸く見えましたが、何も見つかりません。JqGridのテキスト行を折り返す

.ui-jqgrid tr.jqgrow td { 
     white-space: normal !important; 
    } 

これはjqGrid 3.6を使用して私の作品:

答えて

54

には、以下のCSSを試してみてください。


N30が指摘したように、jqGrid 4.0は現在、テキストの折り返しを制御の細かい結晶粒を可能にすることができますcellattr colModelオプションをサポートしています。彼の例から:jQGrid 4.0で

cellattr: function (rowId, tv, rawObject, cm, rdata) { 
    return 'style="white-space: normal;"'; 
} 
27

、これを行うには良い方法は次のようにcolmodel でcellattrを使用することです: - このように

colModel: [ 
      { name: 'ClientName', label: 'Client', index: 'ClientName', width: 150, cellattr: function (rowId, tv, rawObject, cm, rdata) { return 'style="white-space: normal;"' } }, 

      .... other columns 

      ] 

あなたは、個々の列に折り返しのスタイルを適用することができます重要なことを使用する必要はありません!

4

私はヘッダーのこの問題を抱えていました。これをIEで修正するには、このすべてが必要でした。これはヘッダであり、セルではないことに注意してください。これの問題は、おそらくあなたが望む以上に効果があることです(私は後で発見します)が、いつでもCSSセレクターを改良したり、特定の#tableIdNameやクラスを参照できるようにすることができますあなたが好きなようにオプトインしてください。

.ui-jqgrid .ui-jqgrid-htable th div { 
overflow: visible !important; 
height: auto !important; 
} 

.ui-th-column, .ui-jqgrid .ui-jqgrid-htable th.ui-th-column { 
    white-space: normal !important; 
} 

.ui-jqgrid .ui-th-div-ie{ 
    white-space: normal !important; 
} 
0

あなたは...

クラス

をご欄にCSSクラスを入れて、あなたのCSSファイルそのクラスのスタイル white-space: normal !important;に入れて classes colModelオプションを使用することができます

文字列

このオプションでは、列にクラスを追加できます。複数のクラスを使用する場合は、スペースを設定する必要があります。例としてclasses:'class1 class2'は、その列のすべてのセルにclass1とclass2を設定します。

グリッドCSSには、省略記号を特定の行に付けることを可能にする事前定義クラスui-ellipsisがあります。また、これはFireFoxでも動作します。

関連する問題