Changer la couleur dynamiquement d'une DataTable
Bonjour ,
Voilà mon "problème", en fait je veux changer dynamiquement la couleur d'une cellule de ma dataTable en fonction de la valeur à l'intérieur.
Si c'est "No" -> rouge
Si c'est "Yes" -> vert
Voici le code de ma dataTable
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
| <h:dataTable value="#{manageOccupation.dataList}" var="dataItem"
border="3">
<h:column>
<f:facet name="header">
<h:outputText value="Selected" />
</f:facet>
<h:selectBooleanCheckbox value="#{dataItem.selected}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Start" />
</f:facet>
<h:outputText value="#{dataItem.occcupation.startDate}">
<f:convertDateTime pattern="dd/MM/yyyy" timeZone="Europe/Paris" />
</h:outputText>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="End" />
</f:facet>
<h:outputText value="#{dataItem.occcupation.endDate}">
<f:convertDateTime pattern="dd/MM/yyyy" timeZone="Europe/Paris" />
</h:outputText>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Mode" />
</f:facet>
<h:outputText value="#{dataItem.occcupation.dayMode}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Type" />
</f:facet>
<h:outputText value="#{dataItem.occcupation.name}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="DaysTaken" />
</f:facet>
<h:outputText value="#{dataItem.occcupation.daysTaken}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="ValidInf" />
</f:facet>
<h:outputText value="#{dataItem.validInf}"
style="#{dataItem.colorInf}"/>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="ValidSup" />
</f:facet>
<h:outputText value="#{dataItem.validSup}"
style="#{dataItem.colorSup}" />
</h:column>
</h:dataTable> |
Là où j'affiche Yes ou No , c'est pour validInf et validSup. Dans mon managed bean j'ai donc un bout de code qui d'une part me met la valeur qu'il faut (soit Yes soit No), d'autre part, initialise le style de la cellule.
Par exemple :
Code:
1
2
3
4
5
6
7
8
9
10
11
|
if (occupation.isValidInf())
{
validInf = "Yes";
colorInf = "width :100%; background-color: green";
}
else
{
validInf = "No";
colorInf = "width:100%; background-color: red";
} |
Le problème c'est qu'il n'y a que la largeur de mon texte qui est colorisé. J'aimerais que toute la cellule le soit. Je pensais pourtant que le "width:100%" règlerai mon problème mais il n'a pas l'air d'en prendre compte (si je ne le met pas, le résultat est identique)
Une idée? :)
