Following post will help you to expand/collapse Tree Structure programmatically.
Create a tree structure surrounded by panel collection and having two buttons in panel collection tool bar to perform expand/collapse operations.
<af:panelCollection id="pc1" styleClass="AFStretchWidth">
<f:facet name="toolbar">
<af:toolbar id="t1">
<af:commandToolbarButton text="Expand All" id="cbb2"
actionListener="#{empBean.expandEmpTreeTable}"
disabled="#{bindings.EmployeeVO1.estimatedRowCount eq 0}"/>
<af:spacer width="10" height="10" id="s21"/>
<af:commandToolbarButton text="Collapse All" id="cbb3"
actionListener="#{empBean.collapseEmpTreeTable}"
disabled="#{bindings.EmployeeVO1.estimatedRowCount eq 0}"/>
</af:toolbar>
</f:facet>
<af:treeTable value="#{bindings.EmployeeVO1.treeModel}" var="node"
selectionListener="#{bindings.EmployeeVO1.treeModel.makeCurrent}"
rowSelection="single" id="tt1"
styleClass="AFStretchWidth"
binding="#{empBean.empTree}" columnStretching="last"
disableColumnReordering="true" expandAllEnabled="true"
rowBandingInterval="1" summary="Display Employee Info"
autoHeightRows="24" partialTriggers="::cbb2 ::cbb3"
initiallyExpanded="true"
horizontalGridVisible="false">
<f:facet name="nodeStamp">
<af:column id="c1" width="250" headerText="Employee Name"
rowHeader="true" inlineStyle="text-align:start;">
<af:outputText id="ot1" value="#{node.EmpName}"
rendered="#{node.EmpName != null ? true : false}"/>
</af:column>
</f:facet>
<af:column id="c3" width="180" headerText="Email"
inlineStyle="#{node.NewCount gt '0' ? 'color:#00ff00;': 'color:#003D5B;'}">
<af:outputText id="ot3" value="#{node.Email}"
rendered="#{node.Email != null ? true : false}"/>
</af:column>
<af:column id="c7" width="180" headerText="Selected"
inlineStyle="text-align:center;">
<af:group id="g1">
<af:selectBooleanCheckbox id="sb2" autoSubmit="true"
value="#{node.empCheck}"
rendered="#{node.empCheck != null ? true : false}"
label=" "/>
</af:group>
</af:column>
<af:clientListener method="expandNode" type="selection"/>
</af:treeTable>
</af:panelCollection>
Create binding to tree table in bean class and add following methods to perform selected operation.
private RichTreeTable empTree;
public void setEmpTree(RichTreeTable empTree) {
this.empTree = empTree;
}
public RichTreeTable getEmpTree() {
return empTree;
}
private void expandTreeChildrenNode(RichTreeTable rt,
JUCtrlHierNodeBinding node,
List<Key> parentRowKey) {
ArrayList children = node.getChildren();
List<Key> rowKey;
if (children != null) {
for (int i = 0; i < children.size(); i++) {
rowKey = new ArrayList<Key>();
rowKey.addAll(parentRowKey);
rowKey.add(((JUCtrlHierNodeBinding)children.get(i)).getRowKey());
disclosedTreeRowKeySet.add(rowKey);
if (((JUCtrlHierNodeBinding)(children.get(i))).getChildren() ==
null)
continue;
expandTreeChildrenNode(rt,
(JUCtrlHierNodeBinding)(node.getChildren().get(i)),
rowKey);
}
}
}
public void collapseEmpTreeTable(ActionEvent actionEvent) {
empTree.getDisclosedRowKeys().clear();
}
public void expandEmpTreeTable(ActionEvent actionEvent) {
// Add event code here...
if (this.empTree != null) {
disclosedTreeRowKeySet = new RowKeySetImpl();
CollectionModel model = (CollectionModel)empTree.getValue();
JUCtrlHierBinding treeBinding =
(JUCtrlHierBinding)model.getWrappedData();
JUCtrlHierNodeBinding rootNode = treeBinding.getRootNodeBinding();
disclosedTreeRowKeySet = empTree.getDisclosedRowKeys();
if (disclosedTreeRowKeySet == null) {
disclosedTreeRowKeySet = new RowKeySetImpl();
}
List<JUCtrlHierNodeBinding> firstLevelChildren =
rootNode.getChildren();
for (JUCtrlHierNodeBinding node : firstLevelChildren) {
ArrayList list = new ArrayList();
list.add(node.getRowKey());
disclosedTreeRowKeySet.add(list);
expandTreeChildrenNode(empTree, node, list);
}
empTree.setDisclosedRowKeys(disclosedTreeRowKeySet);
}
}
Expand/Collapse tree with single click:
Following Java script will help you to expand/collapse tree with single click
<af:resource type="javascript">
function expandNode(evt) {
var tree = evt.getSource();
var rwKeySet = evt.getAddedSet();
var firstRowKey;
for (rowKey in rwKeySet) {
firstRowKey = rowKey;
break;
}
if (tree.isPathExpanded(firstRowKey)) {
tree.setDisclosedRowKey(firstRowKey, false);
}
else {
tree.setDisclosedRowKey(firstRowKey, true);
}
}
</af:resource>
Add clientlistener to treetable to trigger java script and set type as selection
<af:clientListener method="expandNode" type="selection"/>
Create a tree structure surrounded by panel collection and having two buttons in panel collection tool bar to perform expand/collapse operations.
<af:panelCollection id="pc1" styleClass="AFStretchWidth">
<f:facet name="toolbar">
<af:toolbar id="t1">
<af:commandToolbarButton text="Expand All" id="cbb2"
actionListener="#{empBean.expandEmpTreeTable}"
disabled="#{bindings.EmployeeVO1.estimatedRowCount eq 0}"/>
<af:spacer width="10" height="10" id="s21"/>
<af:commandToolbarButton text="Collapse All" id="cbb3"
actionListener="#{empBean.collapseEmpTreeTable}"
disabled="#{bindings.EmployeeVO1.estimatedRowCount eq 0}"/>
</af:toolbar>
</f:facet>
<af:treeTable value="#{bindings.EmployeeVO1.treeModel}" var="node"
selectionListener="#{bindings.EmployeeVO1.treeModel.makeCurrent}"
rowSelection="single" id="tt1"
styleClass="AFStretchWidth"
binding="#{empBean.empTree}" columnStretching="last"
disableColumnReordering="true" expandAllEnabled="true"
rowBandingInterval="1" summary="Display Employee Info"
autoHeightRows="24" partialTriggers="::cbb2 ::cbb3"
initiallyExpanded="true"
horizontalGridVisible="false">
<f:facet name="nodeStamp">
<af:column id="c1" width="250" headerText="Employee Name"
rowHeader="true" inlineStyle="text-align:start;">
<af:outputText id="ot1" value="#{node.EmpName}"
rendered="#{node.EmpName != null ? true : false}"/>
</af:column>
</f:facet>
<af:column id="c3" width="180" headerText="Email"
inlineStyle="#{node.NewCount gt '0' ? 'color:#00ff00;': 'color:#003D5B;'}">
<af:outputText id="ot3" value="#{node.Email}"
rendered="#{node.Email != null ? true : false}"/>
</af:column>
<af:column id="c7" width="180" headerText="Selected"
inlineStyle="text-align:center;">
<af:group id="g1">
<af:selectBooleanCheckbox id="sb2" autoSubmit="true"
value="#{node.empCheck}"
rendered="#{node.empCheck != null ? true : false}"
label=" "/>
</af:group>
</af:column>
<af:clientListener method="expandNode" type="selection"/>
</af:treeTable>
</af:panelCollection>
Create binding to tree table in bean class and add following methods to perform selected operation.
private RichTreeTable empTree;
public void setEmpTree(RichTreeTable empTree) {
this.empTree = empTree;
}
public RichTreeTable getEmpTree() {
return empTree;
}
private void expandTreeChildrenNode(RichTreeTable rt,
JUCtrlHierNodeBinding node,
List<Key> parentRowKey) {
ArrayList children = node.getChildren();
List<Key> rowKey;
if (children != null) {
for (int i = 0; i < children.size(); i++) {
rowKey = new ArrayList<Key>();
rowKey.addAll(parentRowKey);
rowKey.add(((JUCtrlHierNodeBinding)children.get(i)).getRowKey());
disclosedTreeRowKeySet.add(rowKey);
if (((JUCtrlHierNodeBinding)(children.get(i))).getChildren() ==
null)
continue;
expandTreeChildrenNode(rt,
(JUCtrlHierNodeBinding)(node.getChildren().get(i)),
rowKey);
}
}
}
public void collapseEmpTreeTable(ActionEvent actionEvent) {
empTree.getDisclosedRowKeys().clear();
}
public void expandEmpTreeTable(ActionEvent actionEvent) {
// Add event code here...
if (this.empTree != null) {
disclosedTreeRowKeySet = new RowKeySetImpl();
CollectionModel model = (CollectionModel)empTree.getValue();
JUCtrlHierBinding treeBinding =
(JUCtrlHierBinding)model.getWrappedData();
JUCtrlHierNodeBinding rootNode = treeBinding.getRootNodeBinding();
disclosedTreeRowKeySet = empTree.getDisclosedRowKeys();
if (disclosedTreeRowKeySet == null) {
disclosedTreeRowKeySet = new RowKeySetImpl();
}
List<JUCtrlHierNodeBinding> firstLevelChildren =
rootNode.getChildren();
for (JUCtrlHierNodeBinding node : firstLevelChildren) {
ArrayList list = new ArrayList();
list.add(node.getRowKey());
disclosedTreeRowKeySet.add(list);
expandTreeChildrenNode(empTree, node, list);
}
empTree.setDisclosedRowKeys(disclosedTreeRowKeySet);
}
}
Expand/Collapse tree with single click:
Following Java script will help you to expand/collapse tree with single click
<af:resource type="javascript">
function expandNode(evt) {
var tree = evt.getSource();
var rwKeySet = evt.getAddedSet();
var firstRowKey;
for (rowKey in rwKeySet) {
firstRowKey = rowKey;
break;
}
if (tree.isPathExpanded(firstRowKey)) {
tree.setDisclosedRowKey(firstRowKey, false);
}
else {
tree.setDisclosedRowKey(firstRowKey, true);
}
}
</af:resource>
Add clientlistener to treetable to trigger java script and set type as selection
<af:clientListener method="expandNode" type="selection"/>
No comments:
Post a Comment
Provide your thoughts !