読者です 読者をやめる 読者になる 読者になる

PrimeFaces SelectOneMenu で SelectItemGroup を使ってると Height が微妙。。

PrimeFaces 5.2 の話しです。

だいぶ前にフォーラムに投げて忘れてたのを書いてみました。
PrimeFaces Community Forum • View topic - SelectOneMenu grouping height issues?
サンプルソースは、フォーラムの方で見て下さい。
実行結果はこんなの。


SelectItemGroup を使ってて、SelectItemGroup の数が少ない場合、height が auto になって、スクロールが出ません。

多分ここが問題なんだろうな~って箇所のソースを紹介しときます。

calculateWrapperHeight で要素の数によって、高さを auto か 200 にしています。
primefaces/SelectOneMenuRenderer.java at 5_2 · primefaces/primefaces · GitHub

で要素の数は何を渡しているかというと、selectItems のサイズなんですね。
primefaces/SelectOneMenuRenderer.java at 5_2 · primefaces/primefaces · GitHub

でも grouping の場合は、selectItems に入ってるのは SelectItemGroup であって、SelectItem ではありません。
これ SelectItemGroup の場合は、中でもってる SelectItem の数に直したら良いのにって感じ。
なので、SelectItemGroup は 5個しかないけど、SelectItemGroup 全体が持ってる SelectItem が 100個あると、不細工な見た目になります。

対応策は、.ui-selectonemenu-items-wrapper を height: 200px !important; したらいいんですが、全部の SelectOneMenu に掛かるのでNG。
id の最後の文字指定で何とかって感じ?

<style type="text/css">
  div[id$="対象のSelectOneMenuに付けたID_panel"] .ui-selectonemenu-items-wrapper { 
    height: 200px !important; 
  }
</style>

英文が悪いのかフォーラムは無反応。*1

master でも変わってないし、他の Renderer も同じような実装なので仕様なのかも。

*1:課金したら対応変わるだろうけど、対応策あるし別に…