Skip to content

Instantly share code, notes, and snippets.

@priyankahdp

priyankahdp/form.xhtml

Created June 24, 2014 05:35
Show Gist options
  • Save priyankahdp/98ed88bbb4c7d332b2bb to your computer and use it in GitHub Desktop.
Save priyankahdp/98ed88bbb4c7d332b2bb to your computer and use it in GitHub Desktop.
Download ZIP
collapsibleDataTable Expand Issue
Raw
form.xhtml
....
<script>
function richTreeCollapse(){
$('[id$=sbtbl]').each(function(n){this.rf.component.collapse();});
}
</script>
<div style="text-align: center">
<a4j:commandButton id="btnCopEdit" value="Edit" execute="@form" disabled="#{corporateManagementController.enableAdd}"
oncomplete="if(#{!facesContext.validationFailed}) {#{rich:component('infoPopup')}.show();};richTreeCollapse()"
action="#{corporateManagementController.editBttnHandler()}"
render="#{rich:clientId('pnlUpperCopRegData')} #{rich:clientId('infoPopup')} #{rich:clientId('idPanelCopCardSearch')} #{rich:clientId('pnlUpperOrganizationInfo')} userOrganizationNameSelectOneMenu" />
...
Raw
registerDataTable.xhtml
<!DOCTYPE html 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:h="http://java.sun.com/jsf/html"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<style>
/*.rf-edt-hdr-c {
border-right:none !important;
border-bottom:none !important;
}
.rf-edt-c {
height: 100% !important;
border-right:none !important;
border-bottom:none !important;
}*/
/*.rf-edt-cnt td {*/
/*.rf-cst-c, .rf-dt-c, tr, td, .rf-cst-c, .rf-dt-c, .rf-cst,.rf-cst-r,.rf-cst-c{*/
.orgRegDataTable .rf-cst-c, .orgRegDataTable .rf-dt-c , .orgRegDataTable .rf-cst{
border-bottom: none/*1px solid #9FC0E9*/;
border-top: none/*1px solid #9FC0E9*/;
border-right-width: 1px;
}
table.loFixedCoporate {
table-layout:fixed;
}
tbody.rf-dt-b td:first-of-type, tr.rf-cst-r td:first-of-type, tr.rf-dt-hdr th:first-of-type{
border-left:solid 1px #C4C0C9 !important;
}
/*tbody:nth-last-of-type(2) td.rf-cst-c{*/
.regTableBottomBorderDiv {
border-bottom:solid 1px #C4C0C9 !important;
}
.regTableAndBottomBorderDiv {
width: 100%;
}
</style>
<h:form>
<br/>
<h:panelGroup id="pnlUpperCopRegData" >
<h:panelGroup layout="block" rendered="#{corporateManagementController.currentState !='addAppsToOrg' }">
<div style="border:solid 1px #C4C0C9;width:85%">
<rich:dataTable value="1" var="v" style="width:98.3%" styleClass="loFixedCoporate">
<f:facet name="header">
<rich:columnGroup>
<rich:column breakRowBefore="true" style="width:20%;">
<h:outputText value="Name" />
</rich:column>
<rich:column style="width:8%;">
<h:outputText value="BRC" />
</rich:column>
<rich:column style="width:8%;">
<h:outputText value="Registration Date" />
</rich:column>
<rich:column style="width:10%;">
<h:outputText value="Address 1" />
</rich:column>
<rich:column style="width:10%;">
<h:outputText value="Address 2" />
</rich:column>
<rich:column style="width:10%;">
<h:outputText value="Address 3" />
</rich:column>
<rich:column style="width:9%;">
<h:outputText value="Contact No" />
</rich:column>
<rich:column style="width:15%;">
<h:outputText value="Contact Person" />
</rich:column>
<rich:column style="width:5%;">
<h:outputText value="Status" />
</rich:column>
<rich:column style="width:5%;">
<h:outputText value="" />
</rich:column>
</rich:columnGroup>
</f:facet>
</rich:dataTable>
<h:panelGroup id="pnlCopRegData" rendered="#{corporateManagementController.currentState !='addAppsToOrg' }">
<div style="height:250px;width:99.9%; overflow-x:auto; overflow-y:scroll;">
<rich:dataTable styleClass="orgRegDataTable regTableAndBottomBorderDiv loFixedCoporate"
value="#{corporateManagementController.corporateBeanWrapperList}"
var="list">
<rich:column style="width:20%;">
<rich:collapsibleSubTableToggler for="sbtbl" expandedIcon="../images/treeExpanded.png"
collapsedIcon="../images/treeCollapsed.png" />
<h:outputText value="#{list.organizationBean.name}" style="margin-left:2px;"/>
</rich:column>
<rich:column style="width:8%;"/>
<rich:column style="width:8%;"/>
<rich:column style="width:10%;"/>
<rich:column style="width:10%;"/>
<rich:column style="width:10%;"/>
<rich:column style="width:9%;"/>
<rich:column style="width:15%;"/>
<rich:column style="width:5%;"/>
<rich:column style="width:5%;"/>
<rich:collapsibleSubTable value="#{list.organizationBeanList}"
var="item" id="sbtbl" expandMode="client">
<rich:column width="130px" >
<h:outputText value="#{item.name}" style="margin-left:40px;"/>
</rich:column>
<rich:column>
<h:outputText value="#{item.brc}" />
</rich:column>
<rich:column>
<h:outputText value="#{item.registerDate}">
<f:convertDateTime pattern="dd/MM/yyyy"/>
</h:outputText>
</rich:column>
<rich:column>
<h:outputText value="#{item.address1}" />
</rich:column>
<rich:column>
<h:outputText value="#{item.address2}" />
</rich:column>
<rich:column>
<h:outputText value="#{item.address3}" style="word-wrap: break-word;verticle-align:top;"/>
</rich:column>
<rich:column>
<h:outputText value="#{item.contactNo}" />
</rich:column>
<rich:column>
<h:outputText value="#{item.contactPerson}" />
</rich:column>
<rich:column>
<h:outputText value="#{item.status == 0?'Inactive' :'Active'}" />
</rich:column>
<rich:column style="text-align:center;">
<a4j:commandLink value="Edit" action="#{corporateManagementController.setSelectedOrganizationInfo(item)}"
render="pnlOrganizationInfo" execute="@this" immediate="true"
style="font-weight:bold;text-decoration:none;" />
</rich:column>
</rich:collapsibleSubTable>
</rich:dataTable>
<div class="regTableBottomBorderDiv regTableAndBottomBorderDiv"/>
</div>
</h:panelGroup>
</div>
</h:panelGroup>
</h:panelGroup>
</h:form>
<script>
jQuery('.rf-cst').css({'display':'none'});
jQuery('.rf-csttg-colps').css({'display':'inline'});
jQuery('.rf-csttg-exp').css({'display':'none'});
jQuery('.rf-csttg-colps').click();
</script>
</ui:composition>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment