web-dev-qa-db-ja.com

p:dataTable p:column widthを設定します

データテーブルの列幅を設定しようとしています。この質問で答えを探しました PrimeFaces 3.0のp:dataTableでp:columnの幅を設定するには?

しかし、私は少し違うことをしようとしています。列の幅を、それが表示している最も幅の広い要素と同じ幅にしたいだけです。私のデータのほとんどはテキストです。

たとえば、このように見えるべきではありません

 ----------------------------- 
 |これはテキストです| 
 ----------------------------- 

このように見えるはずです

 --------------------- 
 |これはテキストです| 
 --------------------- 

複数の行がある場合、列は最も幅の広い要素と同じ大きさにする必要があります。

19
user489041

私はいつも使う

<p:dataTable ........ tableStyle="width:auto">

そして、あなたがあなたのデータテーブルに期待することをします。

50
Maco

テーブルの幅を100%のままにしたい場合は、

tableStyle="table-layout: auto;"
34
Szarpul

Macoの答えは魅力のように機能します。ただし、データ列とヘッダーが揃っていない場合、解決策の1つは、必要な<p:column>属性を使用して各min-widthにスタイルを追加することです(すべての<p:column>で同じにする必要があります) <p:dataTable>)。 CSSでスタイルクラスを定義し、<p:column>のstyleClass属性を使用してそれを参照する方が実用的かもしれません。そのようにして、最小幅を変更することにした場合、1か所で変更するだけで済みます。

<p:column style="min-width: 100px;">
...
</p:column>

PF 5.3でテスト済み

0
CheshellCat