1

私はデータブルを持っており、その中にコマンドボタンを列として持っています。選択時と選択解除時のコマンドボタンの色を変更したいと思います。たとえば、選択されていない/選択解除されている場合は赤色、選択されている場合は緑色です。

私のデータテーブルは次のようになります。

<p:dataTable id="interfaces"
    value="#{studentBean.studentDataModel}"
    var="studentDetails" emptyMessage="No Student found."
    selection="#{studentBean.selectedStudents}" >

    <p:column headerText="Select this Student" style="width:1%">
        <p:commandButton value="Select"
            action="#{studentBean.saveThisStudent}"
            styleClass="non-selected-button-background-color">
        </p:commandButton>
    </p:column>

</p:dataTable>

以下は、default.cssの中にあるものです

.non-selected-button-background-color {
    background-color: blue
}

.selected-button-background-color {
    background-color: green
}

どうすれば機能を実現できますか?

機能を更新しました:
1) すべてのコマンドボタンは最初は青色です
2) ボタンをクリックすると、色が緑色に変わります
3) 同じボタンをもう一度クリックすると、色が青色に変わります
4) 別のボタンをクリックすると機能します下 -

  • 緑色のボタンがある場合は、最初に青色にします
  • 次に、クリックしたボタンの色を緑に変更します。
4

3 に答える 3

1

問題はあなたのスタイルにあると思います。背景色を置き換えるだけですが、一部のプライムフェイス スタイルでは、dataTable の背景としてイメージを使用します。

交換

background-color: green;

background: green;

そして私はそれがうまくいくと思います。

于 2013-09-16T12:11:17.890 に答える
0

デフォルトまたは特別な primafaces テーマを使用するため、最初に
background-image css 属性 none を設定する必要があります。このテーマは、構成要素である背景画像を使用するためです。これは、シンプルで便利なprimefacesボタンのCSS継承クラスです。

.styleFilterCommandButton-BackgroundColor,
.ui-widget-content .styleFilterCommandButton-BackgroundColor,
.ui-widget-header .styleFilterCommandButton-BackgroundColor*
{
    background-image:none;
    background-color: #ee4400;  
}
于 2014-04-11T11:26:37.240 に答える