Empty Cell is added while using extended data table of rich
Hi All,
I am using an extendedDataTable instead of simple DataTable to use multiple/single selection functionality. But in extendedDataTable an empty cell is added at the end of data cells used. while overwriting the css 'extdt-empty-cell' and 'th.extdt-empty-cell' the header and cells are not at all consistent.
Here is my file:
<!DOCTYPE html PUBLIC "//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">
.selRowColor {
background-color: #686868;
padding-left: 4px;
padding-top: 4px;
border: 1px solid #C0C0C0;
}
.jobsExtTable {
width: 100%;
}
.jobsExtTable thead {
background-image: none;
}
.jobsExtTable thead tr th {
background-image: none;
}
.jobsExtTable thead tr th {
border: 1px solid #c0c0c0;
background-image: none;
}
.jobsExtTable tbody {
}
.jobsExtTable tbody tr {
}
.jobsExtTable tbody tr td {
}
.rich-sdt-column-cell {
width: 0px;
}
.rich-sdt-header-cell-body {
width: 0px;
padding-right: -4px;
}
.extdt-empty-cell {
width: 0px;
margin: 0px;
}
th.extdt-empty-cell {
width: 7px;
}
th.rich-extdt-subheadercell {
width: 7px;
}
<f:view>
<rich:extendedDataTable id="filedirTableDTR" rendered="true"
rowKeyVar="curRow" value="#{sun.list}" selectionMode="multi"
columnClasses="column1FileTable, column2FileTable , column3FileTable"
styleClass="jobsExtTable" rowClasses="oddRowColor, evenRowColor"
selectedClass="selRowColor" headerClass="jobsTableHeader"
style="padding:0px;" var="item" selfSorted="false"
enableContextMenu="false" height="400px;"
footerClass="jobsTableHeader">
<rich:column sortable="false" selfSorted="false"
style="overflow: hidden; white-space: nowrap; table-layout: fixed; border-left:1px solid #c0c0c0;">
<f:facet name="header">
<h:panelGroup style="text-align: left; vertical-align: middle">
<h:outputText value="Name" />
</h:panelGroup>
</f:facet>
<h:outputText value="#{item.name}" />
</rich:column>
<rich:column sortable="false" selfSorted="false"
style="overflow: hidden; white-space: nowrap; table-layout: fixed; border-left:1px solid #c0c0c0;">
<f:facet name="header">
<h:panelGroup style="text-align: left; vertical-align: middle">
<h:outputText value="Id" />
</h:panelGroup>
</f:facet>
<h:outputText value="Id" />
</rich:column>
<rich:column sortable="false" selfSorted="false"
style="overflow: hidden; white-space: nowrap; table-layout: fixed; border-left:1px solid #c0c0c0;">
<f:facet name="header">
<h:panelGroup style="text-align: left; vertical-align: middle">
<h:outputText value="Address" />
</h:panelGroup>
</f:facet>
<h:outputText value="#{item.addr}" />
</rich:column>
</rich:extendedDataTable>
</f:view>
Please help me in this regard.
Thanks in advance.
--
Sunil
