JSFでエラー項目の背景色を変える

はじめに

・今回はJSFで「エラー項目の背景色を変更」してみます。

方法

・PhaseListener（RENDER_RESPONSE）でstyleClass（has-error）を操作ます。

説明

・レンダリング直前にCONTEXTを編集

・XHTMLでstyleClassを定義
    <input type="text" jsf:styleClass="form-control" />

・cssへエラー時の背景色を設定
    .form-control.has-error {
          background-color:#f2dede !important;
    }
    .form-control.has-error:-webkit-autofill {
          -webkit-box-shadow: 0 0 0px 1000px #f2dede inset;
    }

まとめ

・component.clientIdを利用した処理＋XHTMLの全コントロールへ設定というほうが柔軟なのかもしれませんが、HTMLで意識して実装しなくてはなりません、　単純なコントロールは今回の方法で十分に機能します。　このためだけにlistener定義するのは、少し大げさなのかもしれませんけど、RENDER_RESPONSEは、他の処理もするので少しコードが増えるだけですよね・・・OK