Missing border line inside extended datatable
Hi,
Thanks for the reply from Ilya Shaikovsky and I would like to ask below question.
I have a page with extended datatable and a save button. In order to give the position of the vertical scroll bar of the extended datatable, I do not render the datatable, but just rendered the columns.
However, after rendering the column of pressing the save button, I found missing border lines inside the extended datatable. Is there something I did wrong or else ?
Please help and thanks
Code for Information
==============
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition 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:s="http://jboss.com/products/seam/taglib"
xmlns:a="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
template="fis_template.xhtml">
<ui:define name="contentArea">
<a:loadBundle var="bundle" basename="fis.gl.GlMaintainResources" />
<h1><h:outputText value="#{bundle.tblMaintSectCodeHeadingSectionCode}"/></h1>
<h:form id="glSectionCodeForm1" >
<a:queue requestDelay="900" ignoreDupResponses="true"/>
<div >
<div >
<h:panelGrid columns="2" columnClasses="message, menu">
<rich:messages layout="table"/>
<h:graphicImage
rendered="#{not userRights}"
value="/img/#{bundle.mnuFunctionMouseDim}"
style="border: 0px" />
<rich:spacer
rendered="#{not userRights}"
height="3"/>
<f:facet name="label">
<h:graphicImage
rendered="#{not userRights}"
value="/img/#{bundle.mnuFunctionMouseDim}"
style="border: 0px" />
</f:facet>
<h:panelGrid styleClass="vertical-menu-cell" columnClasses="optionList" columns="1" cellspacing="0" cellpadding="0"
rendered="#{userRights}"
>
<rich:dropDownMenu
rendered="#{userRights}"
id="MenuItem1"
verticalOffset="1"
horizontalOffset="6"
selectItemClass="select_item"
selectionMode="multi"
enableContextMenu="false"
>
<f:facet name="label">
<h:graphicImage
rendered="#{userRights}"
value="/img/#{bundle.mnuFunctionMouseUp}"
style="border: 0px" />
</f:facet>
<rich:menuItem submitMode="ajax" value="#{bundle.menuAddRows}" action="#{glSectCodeList.addRows}" reRender="glSectCodesTable"/>
<rich:menuItem submitMode="ajax" value="#{bundle.menuInsertRows}" action="#{glSectCodeList.insertRows}" reRender="glSectCodesTable"/>
<rich:menuItem submitMode="ajax" value="#{bundle.menuDeleteRows}" action="#{glSectCodeList.deleteRows}" reRender="glSectCodesTable"/>
<rich:menuItem submitMode="ajax" value="#{bundle.menuDuplicateRows}" action="#{glSectCodeList.duplicateRows}" reRender="glSectCodesTable"/>
</rich:dropDownMenu>
</h:panelGrid>
</h:panelGrid>
</div>
<rich:extendedDataTable
value="#{glSectCodes}"
var="hot"
id="glSectCodesTable"
height="250px"
sortMode="single"
selectionMode="multi"
enableContextMenu="false"
rowClasses="odd-row, even-row"
onRowMouseOver="this.style.backgroundColor='#E6E8FA'"
onRowMouseOut="this.style.backgroundColor='#{rowKeyVar}'"
>
<rich:column id="column1" style="#{hot.recStyle};text-align:center" width="120px" sortBy="#{hot.pk.sectIdent}" filterBy="#{hot.pk.sectIdent}" filterEvent="onkeyup">
<f:facet id="NameFacet" name="header"><h:outputText value="#{bundle.tblMaintSectCodeColheadingSectionCode}"/></f:facet>
<h:panelGroup>
<h:inputText id="sectIdent" value="#{hot.pk.sectIdent}" size="1" maxlength="1"
style="text-align:center"
readonly="#{not hot.newRecord}" >
<f:converter converterId="itemBeanToUpperCaseConverter"/>
<a:support event="onchange"
reRender="sectIdent"
actionListener="#{hot.statusListener}"/>
</h:inputText>
</h:panelGroup>
</rich:column>
<rich:column id="column2" style="#{hot.recStyle}" width="350px" sortBy="#{hot.description}" filterBy="#{hot.description}" filterEvent="onkeyup">
<f:facet id="DescriptionFacet" name="header"><h:outputText value="#{bundle.tblMaintSectCodeColheadingDescription}"/></f:facet>
<h:panelGroup>
<h:inputText value="#{hot.description}" size="60" maxlength="60"
readonly="#{not userRights}" >
<a:support event="onchange"
actionListener="#{hot.statusListener}"/>
</h:inputText>
</h:panelGroup>
</rich:column>
<rich:column id="column3" width="80px" style="#{hot.recStyle};">
<f:facet id="NameFacet" name="header">
<h:panelGroup column="2">
<rich:spacer width="14"/>
<h:outputText value="#{bundle.rowSelect}"/>
</h:panelGroup>
</f:facet>
<h:panelGroup>
<rich:spacer width="26"/>
<h:selectBooleanCheckbox id="sel" value="#{tblSels[hot]}"
readonly="#{not userRights}"/>
</h:panelGroup>
</rich:column>
</rich:extendedDataTable>
</div>
<h:panelGroup>
<a:commandLink
action="#{glSectCodeList.backPage}" >
<h:graphicImage value="/img/#{bundle.btnBackToHomeMouseUp}"
style="border: 0px"
onmousedown="this.src='../../img/#{bundle.btnBackToHomeMouseDown}';"
onmouseup="this.src='../../img/#{bundle.btnBackToHomeMouseUp}';"
onmouseout="this.src='../../img/#{bundle.btnBackToHomeMouseUp}';"
/>
</a:commandLink>
<rich:spacer width="10" />
<a:commandLink id="save"
action="#{glSectCodeList.save}"
ajaxSingle="false"
reRender="column1,column2,column3"
readonly="#{not userRights}"
onclick="Richfaces.showModalPanel('glProgressPanel',{param1:'#{bundle.validationWait}'})"
oncomplete="Richfaces.hideModalPanel('glProgressPanel');javascript:setReadOnly();">
<h:graphicImage
rendered="#{userRights}"
value="/img/#{bundle.btnSaveMouseUp}"
style="border: 0px"
onmousedown="this.src='../../img/#{bundle.btnSaveMouseDown}';"
onmouseup="this.src='../../img/#{bundle.btnSaveMouseUp}';"
onmouseout="this.src='../../img/#{bundle.btnSaveMouseUp}';"
/>
<h:graphicImage
rendered="#{not userRights}"
value="/img/#{bundle.btnSaveMouseDimm}"
style="border: 0px"
/>
</a:commandLink>
</h:panelGroup>
</h:form>
</ui:define>
</ui:composition>