这是Java代码
@ManagedBean
public class DatatableBean {
private List<Employee> emplList = new ArrayList<Employee>();
public DatatableBean(){
emplList.add(new Employee("Jack", 1, "Engineer"));
emplList.add(new Employee("Jim", 2, "Engineer"));
emplList.add(new Employee("Kelly", 3, "Manager"));
}
public List<Employee> getEmplList() {
return emplList;
}
public void setEmplList(List<Employee> emplList) {
this.emplList = emplList;
}
}
这是XHTML代码
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head><title>JSF datatable demo</title>
<style>
.employee {
font: verdana;
background:green;
}
.manager {
font: arial;
background:blue;
}
.default {
font: helvetica;
background:red;
}
</style>
</h:head>
<body>
<h:dataTable rowClasses="#{empl.designation eq 'Manager' ? 'manager' : empl.designation eq 'Engineer' ? 'employee' : 'default'}"
<h:column>
<f:facet name="header">
<h:outputText value="Id" />
</f:facet>
<h:outputText value="#{empl.id}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Name" />
</f:facet>
<h:outputText value="#{empl.name}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Designation" />
</f:facet>
<h:outputText value="#{empl.designation}" />
</h:column>
</h:dataTable>
</body>
</html>
我按照这个答案
Color the rows of datatable based a condition in JSF 2
并写了上面的代码。但是，所有行仅在浏览器中呈现默认的CSS。
即使我将“ eq”更改为“ ==”，输出仍保持不变。
这是浏览器中呈现的代码
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>JSF datatable demo</title>
<style>
.employee {
font: verdana;
background:green;
}
.manager {
font: arial;
background:blue;
}
.default {
font: helvetica;
background:red;
}
</style></head>
<body><table>
<thead>
<tr>
<th scope="col">Id</th>
<th scope="col">Name</th>
<th scope="col">Designation</th>
</tr>
</thead>
<tbody>
<tr class="default">
<td>1</td>
<td>Jack</td>
<td>Engineer</td>
</tr>
<tr class="default">
<td>2</td>
<td>Jim</td>
<td>Engineer</td>
</tr>
<tr class="default">
<td>3</td>
<td>Kelly</td>
<td>Manager</td>
</tr>
</tbody>
</table>
</body>
</html>
请帮忙
提前致谢
最佳答案
这个答案很好用
JSF: Changing datatable cell color dynamically
我不确定为什么我无法在rowClasses属性中使用var属性值
更新的代码
XHTML代码
<h:outputText value="#{datatableBean.rowClass}" />
<h:dataTable
value="#{datatableBean.emplList}" var="empl" rowClasses="#{datatableBean.rowClass}" >
<h:column>
<f:facet name="header">
<h:outputText value="Id" />
</f:facet>
<h:outputText value="#{empl.id}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Name" />
</f:facet>
<h:outputText value="#{empl.name}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Designation" />
</f:facet>
<h:outputText value="#{empl.designation}" />
</h:column>
</h:dataTable>
这是Java代码（在上面的Java代码中添加了此方法）
public String getRowClass() {
StringBuilder rowClasses = new StringBuilder();
for (Employee employee : emplList) {
if (rowClasses.length() > 0) rowClasses.append(",");
if(employee.getDesignation().equalsIgnoreCase("Engineer")) {
rowClasses.append("employee");
} else if(employee.getDesignation().equalsIgnoreCase("Manager")) {
rowClasses.append("manager");
}
}
return rowClasses.toString();
}
并且输出按预期工作。
谢谢！
关于css - 为JSF数据表的行着色，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/27466886/