Hi,
I am working with primefaces tree component. There is a context menu for the tree (add a node, edit node, delete node). After performing some operation, I need to refresh the tree and then highlight the node added or edited.
To give clear picture: 1) I am having a singleSelect tree with context menu (add child, edit, delete).
2) When I click on add child, a dialog will get open which contains the required fields and a button(SAVE).
3) when I click on SAVE button, I am inserting the node to database and reloading the tree. I am loosing the selected node and tree is getting collapsed.
4) I have to refresh only the tree and highlight the node which is added freshly.
Please give me some idea to solve this issue.
Primefaces 2.2, Glassfish V3
How to highlight a primefaces tree node from backing bean
Hi,
You have to update your tree model and render the updated tree again. DefaultTreeNode has isSelected() / setSelected() methods. Use them and also isExpanded() / setExpanded().
You have to update your tree model and render the updated tree again. DefaultTreeNode has isSelected() / setSelected() methods. Use them and also isExpanded() / setExpanded().
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin
Hi thank you for the reply.
My tree is in a tabview. How can I update the tree view only.
It is like, onclick of save button I need to close the dialog and call the action listener to save the new node and then rerender the tree. Highlight the newly added node in blue color.
I think node.setselected is not there.
I am posting the sample code to give an idea
<p:tree value="#{searchBean.root}" var="node"
nodeSelectListener="#{searchBean.handleNodeSelect}"
rendered="#{searchBean.root != null}"
selectionMode="single"
update="result1"
id="pTree"
selection="#{searchBean.selectedNode1}"
widgetVar="primeTree">
<p:treeNode>
<h:outputText value="#{node}" style="font-weight: bold; font-size: 14px;" />
</p:treeNode>
</p:tree>
<p:contextMenu for="pTree" rendered="#{searchBean.authoring}">
<p:menuitem value="Add topic as child" update="form3"
onclick="dlg4.show();"
actionListener="#{searchBean.addTopicAsChild}"/>
</p:contextMenu>
<p:dialog header="Add topic as child" widgetVar="dlg4"
height="600" width="870">
<h:form id="form3">
<h:outputText value="Topic ID "/>
<h:inputText size="20" value="#{searchBean.topicID_dlg}"
required="true" id="topicid"/>
<p:spacer width="40" height="10" />
<h:outputText value="Parent ID "/>
<h:inputText size="20" value="#{searchBean.parentID_dlg}"
readonly="true"/>
<br/><br/>
<h:outputText value="Subject "/>
<h:inputText size="45" value="#{searchBean.subject_dlg}"
required="true" id="subject"/>
<br/><br/>
<h:outputText value="Content "/>
<p:editor id="editor3" width="800" height="350"
value="#{searchBean.content_dlg}"/>
<h:panelGrid columns="2" style="margin-top:10px">
<p:commandLink update="pTree" type="button"
action="#{searchBean.saveChilddNode}"
onclick="dlg4.hide()"
oncomplete="reloadPage();"
><h:graphicImage alt="Save" url="/images/Save.jpg"/>
</p:commandLink>
<p:commandLink onclick="dlg4.hide()">
<h:graphicImage alt="Back" url="/images/Cancel.jpg"/>
</p:commandLink>
</h:panelGrid>
</h:form>
</p:dialog>
Bean
=======
public void saveChilddNode() {
boolean isSaved = false;
String htmlContent = content_dlg;
isSaved = SearchDao.saveTreeNode(topicID_dlg, parentID_dlg, ChildNodeCount, subject_dlg, htmlContent, plainContent);
}
if (isSaved) {
SearchBean s1 = new SearchBean();
root = s1.getRoot();
sortIndex = 0;
expandSelected();
setActiveIndex(0);
}
}
private void expandSelected() {
if (selectedNode1 == null) {
return;
}
TreeNode node = selectedNode1;
while (node.getParent() != null) {
node = node.getParent();
node.setExpanded(true);
}
}
My tree is in a tabview. How can I update the tree view only.
It is like, onclick of save button I need to close the dialog and call the action listener to save the new node and then rerender the tree. Highlight the newly added node in blue color.
I think node.setselected is not there.
I am posting the sample code to give an idea
<p:tree value="#{searchBean.root}" var="node"
nodeSelectListener="#{searchBean.handleNodeSelect}"
rendered="#{searchBean.root != null}"
selectionMode="single"
update="result1"
id="pTree"
selection="#{searchBean.selectedNode1}"
widgetVar="primeTree">
<p:treeNode>
<h:outputText value="#{node}" style="font-weight: bold; font-size: 14px;" />
</p:treeNode>
</p:tree>
<p:contextMenu for="pTree" rendered="#{searchBean.authoring}">
<p:menuitem value="Add topic as child" update="form3"
onclick="dlg4.show();"
actionListener="#{searchBean.addTopicAsChild}"/>
</p:contextMenu>
<p:dialog header="Add topic as child" widgetVar="dlg4"
height="600" width="870">
<h:form id="form3">
<h:outputText value="Topic ID "/>
<h:inputText size="20" value="#{searchBean.topicID_dlg}"
required="true" id="topicid"/>
<p:spacer width="40" height="10" />
<h:outputText value="Parent ID "/>
<h:inputText size="20" value="#{searchBean.parentID_dlg}"
readonly="true"/>
<br/><br/>
<h:outputText value="Subject "/>
<h:inputText size="45" value="#{searchBean.subject_dlg}"
required="true" id="subject"/>
<br/><br/>
<h:outputText value="Content "/>
<p:editor id="editor3" width="800" height="350"
value="#{searchBean.content_dlg}"/>
<h:panelGrid columns="2" style="margin-top:10px">
<p:commandLink update="pTree" type="button"
action="#{searchBean.saveChilddNode}"
onclick="dlg4.hide()"
oncomplete="reloadPage();"
><h:graphicImage alt="Save" url="/images/Save.jpg"/>
</p:commandLink>
<p:commandLink onclick="dlg4.hide()">
<h:graphicImage alt="Back" url="/images/Cancel.jpg"/>
</p:commandLink>
</h:panelGrid>
</h:form>
</p:dialog>
Bean
=======
public void saveChilddNode() {
boolean isSaved = false;
String htmlContent = content_dlg;
isSaved = SearchDao.saveTreeNode(topicID_dlg, parentID_dlg, ChildNodeCount, subject_dlg, htmlContent, plainContent);
}
if (isSaved) {
SearchBean s1 = new SearchBean();
root = s1.getRoot();
sortIndex = 0;
expandSelected();
setActiveIndex(0);
}
}
private void expandSelected() {
if (selectedNode1 == null) {
return;
}
TreeNode node = selectedNode1;
while (node.getParent() != null) {
node = node.getParent();
node.setExpanded(true);
}
}
-
- Information
-
Who is online
Users browsing this forum: No registered users and 22 guests