1 Reply Latest reply on Nov 30, 2009 9:15 AM by Ilya Shaikovsky

    Empty Cell is added while using extended data table of rich

    Sunil Chauraha Newbie

      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