Stylizowanie ostatniego rekordu w datowalnym jsf

Question

Mam sytuację, w której mam więcej danych, niż można umieścić w jednym wierszu zwracanym do elementu dataTable. Aby sobie z tym poradzić, po prostu połączyłem wyniki w jedną komórkę. To, czego szukam, jest sposobem ustalenia, czy osiągnąłem ostatni obiekt w zestawie wyników, czy mogę usunąć dolną granicę używaną jako mój separator. Ostatecznie nie wiem, z iloma obiektami będę miał do czynienia.

.most { 
    background-color:cyan; 
    border-bottom:medium solid black; 
} 
.last { 
    border-bottom:none; 
} 

<h:dataTable id="myTable" value="#{flowData.selectedItem.profile}" var="profile" columnClasses="most, last"> 
<h:column> 
    <h:inputText id="_last" value="#{profile.last}" /> 
    <h:inputText id="_first" value="#{profile.first}" /> 
    <h:inputText id="_middle" value="#{profile.middle}" /> 
    <h:inputText id="_city" value="#{profile.city}" /> 
    <h:inputText id="_state" value="#{profile.state}" /> 
</h:column> 
</h:dataTable> 

Z góry dziękuję za wszelkie dane wejściowe.

Answer 1

To zależy od wersji przeglądarki IE, którą chcesz obsłużyć.

Jeśli nie zależy Ci na obsłudze IE6/7, możesz użyć do tego pseudoklasy CSS2 :last-child.

table.yourTableClass tbody tr td { 
    background-color: cyan; 
    border-bottom: medium solid black; 
} 
table.yourTableClass tbody tr:last-child td { 
    border-bottom: none; 
} 

z

<h:dataTable ... styleClass="yourTableClass"> 

(tak, IE7 obsługuje odpowiednik CSS2 pseudoclass :first-child, ale robi naprawdę nie wspierać :last-child!)

Jeśli dbasz o IE7, ale nie o IE6, możesz też zrobić to na odwrót, z border-top zamiast z border-bottom, które jest ustawiony na none na :first-child:

table.yourTableClass tbody tr td { 
    background-color: cyan; 
    border-top: medium solid black; 
} 
table.yourTableClass tbody tr:first-child td { 
    border-top: none; 
} 

Jeśli jednak także dbać o IE6 (co jest discutable te dni), to nie można obejść generując ciąg klas rzędu poczuć wewnątrz (nie klas kolumna!) zarządzane ziarno.

<h:dataTable ... rowClasses="#{flowData.rowClasses}"> 

z

public String getRowClasses() { 
    StringBuilder builder = new StringBuilder(); 
    int size = selectedItem.getProfile().size(); // getProfiles() ? 

    for (int i = 0; i < size; i++) { 
     builder.append((i + 1 < size) ? "most," : "last"); 
    } 

    return builder.toString(); 
} 

i tym CSS

tr.more td { 
    background-color: cyan; 
    border-bottom: medium solid black; 
} 
tr.last td { 
    border-bottom: none; 
}