-
1. Re: making rich tree load new nodes after they are added to
Hi,
What loadNodes() method are you referring to? -
2. Re: making rich tree load new nodes after they are added to
Oh it is a method I wrote myself. It loads up a list with values and that list is what the tree uses to populate the nodes.
So if I added that to the submit button it would load up the list with new values, but there seems like there might be a better way I dont know of. -
-
4. Re: making rich tree load new nodes after they are added to
I will look into that, I figured there was something like that but not sure what.
Thanks for your insight once again -
5. Re: making rich tree load new nodes after they are added to
Can you give me a better idea of what you mean please? Sorry to bring back an old thread, but this is the final problem I have before my project is complete.
I simply cannot get anything to work with this. I just need my tree to reRender if I add or edit something to it.
I looked into a4j:push, but I can't see how it pertains to this.
Is there any way you can help clear this up for me a bit more? It would be a great help, and I will never have to pester this board about this project again, because I will be done with it!! -
6. Re: making rich tree load new nodes after they are added to
a4j:push re-renders component(s), when some server event happens. You can use that to handle changes in data.
-
7. Re: making rich tree load new nodes after they are added to
I have been looking into this and trying to get a grasp on how it works. Please help me figure this out.
I believe I need to start by binding some method to my a4j:commandButton that reloads my java variables with the new data. I already have this method setup, but it takes 3-6 seconds to run through, because it is 4 for loops nested in each other.
This method will also be the eventProducer for my a4j:push tag right? So when the command button is pressed, it will begin this method, and once the method is complete the a4j:push tag will reRender whatever I have set to the reRender attribute right?
Or am I incorrect on how this works? Looking at the livedemo example it seems like I am probably wrong.
I am going to try it, but I really could use more help with how to use this, other than the livedemo example. -
8. Re: making rich tree load new nodes after they are added to
and also I forgot to mention, my rich:tree is a session scope, not request scope.
If I make it request scope, I can just add a reRender to my a4j:commandButton and it reRenders it just fine, but everything takes forever this way, because the method to load my tree with data takes so long to run. Even expanding a node on the tree makes this method run, so it takes 3-6 seconds just to expand a node when I use request scope -
9. Re: making rich tree load new nodes after they are added to
If you have time Id very much appreciate it if you could give me more specific help by taking a look at my page. This s the entire page, divided into ui:define areas. I need the command buttons that start around the middle of the page to reRender my first rich:tree. There is more than one rich:tree, but I only need the very first one to be reRendered:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich" xmlns:ui="http://java.sun.com/jsf/facelets"> <ui:composition template="/pages/layout.xhtml"> <ui:define name="banner"> <h:form> <h:graphicImage value="/images/NILogo.jpg" width="800" height="50" /> </h:form> </ui:define> <table> <tr> <td> <ui:define name="top_menu"> <h:form> <h:outputLink value="/NI/pages/first.jsf">MDN PROJECT EXPLORER</h:outputLink><h:outputText value=" | " /> <h:outputText value=" | " /><h:outputText value=" | " /><h:outputText value=" | " /> <h:panelGroup> <h:outputLink value="/NI/top_menu/charts.jsf" >CHARTS</h:outputLink><h:outputText value=" | " /> <h:outputLink value="/NI/top_menu/map.jsf" >MY MAP</h:outputLink><h:outputText value=" | " /> </h:panelGroup> <hr/> </h:form> </ui:define> </td> </tr> </table> <table> <tr> <td style="max-width: 20%; float: left"> <ui:define name="project_explorer"> <h:form id="treeForm"> <rich:tree nodeSelectListener="#{updateAllBean.projectSelection}" ajaxSubmitSelection="true" switchType="client" var="item" ajaxKeys="#{null}" reRender="projectForm, deviceForm, channelForm" id="tree"> <rich:treeNodesAdaptor nodes="#{treeBean.projects}" var="projects"> <rich:treeNode icon="/images/projectImg.png" iconLeaf="/images/projectImg.png"> <h:outputText value="#{projects.name}" /> </rich:treeNode> <rich:recursiveTreeNodesAdaptor roots="#{projects.devices}" var="devices"> <rich:treeNode icon="/images/deviceImg.png" iconLeaf="/images/deviceImg.png"> <h:outputText value="#{devices.deviceName}" /> </rich:treeNode> <rich:recursiveTreeNodesAdaptor roots="#{devices.deviceChannels}" var="channel"> <rich:treeNode icon="/images/channelImg.png" iconLeaf="/images/channelImg.png"> <h:outputText value="#{channel.name}" /> </rich:treeNode> </rich:recursiveTreeNodesAdaptor> </rich:recursiveTreeNodesAdaptor> </rich:treeNodesAdaptor> </rich:tree> </h:form> </ui:define> </td> <td style="width:85%; float: right"> <ui:define name="content"> <f:view> <rich:tabPanel switchType="client"> <rich:tab label="PROJECT"> <h:form id="projectForm"> <h4>Please Click on a Project From the Left To Edit It</h4> <br/> <h:outputText value="Project ID: #{updateAllBean.projectId}" /> <br/> <h:outputText value="Project Name: " /> <h:inputText value="#{updateAllBean.projectName}" size="27" required="true"/> <br/><br/> <h:outputText value="UserID: #{updateAllBean.userId}" /> <br/> <h:outputText value="User Permission:" /> <h:inputText value="#{updateAllBean.permission}" size="27"/> <br/><br/> <a4j:commandButton type="submit" value="SUBMIT PROJECT CHANGES" action="#{updateAllBean.updateProject}" reRender="treeForm"/> <h:outputText value=" " /> <a4j:commandButton type="reset" value="REMOVE CHANGES"/> <br/><br/><br/> <h:outputLink value="/NI/add_entity/new_device.jsf">Click here to add a new device to the project</h:outputLink> <br/><br/> <h:outputLink value="/NI/add_entity/new_channel.jsf">Click here to add a new channel to the project</h:outputLink> </h:form> </rich:tab> <rich:tab label="DEVICES"> <h:form id="deviceForm"> <h4>Click on a Device Below To Edit It</h4> (Click on A Project To the Left to Change the Devices Listed) <br/><br/> <h:outputText value="Devices For #{updateAllBean.projectName} (ID - #{updateAllBean.projectId})" style="text-decoration:underline; font-weight:700; font-size:130%" /> <br/><br/> <rich:tree nodeSelectListener="#{updateAllBean.deviceClick}" ajaxSubmitSelection="true" switchType="client" ajaxKeys="#{null}" reRender="deviceId, deviceName, deviceLat, deviceLng" showConnectingLines="false"> <rich:treeNodesAdaptor nodes="#{updateAllBean.deviceList}" var="device"> <rich:treeNode icon="/images/deviceImg.png" iconLeaf="/images/deviceImg.png"> <h:outputText value="#{device.name}" /> </rich:treeNode> </rich:treeNodesAdaptor> </rich:tree> <br/> <h:outputText id="deviceId" value="DeviceID: #{updateAllBean.deviceId}" /> <br/> <h:outputText value="Device Name:" /> <h:inputText id="deviceName" value="#{updateAllBean.deviceName}" size="27" /> <br/> <h:outputText value="Device Latitude: " /> <h:inputText id="deviceLat" value="#{updateAllBean.deviceLat}" size="27"/> <br/> <h:outputText value="Device Longitude: " /> <h:inputText id="deviceLng" value="#{updateAllBean.deviceLng}" size="27"/> <br/><br/> <h:commandButton type="submit" value="SUBMIT DEVICE CHANGES" action="#{updateAllBean.updateDevice}" /> <h:outputText value=" " /> <a4j:commandButton type="reset" value="REMOVE CHANGES"/> <br/><br/><br/> <h:outputLink value="/NI/add_entity/new_channel.jsf">Click here to add a new channel to the device</h:outputLink> <br/><br/> <h:outputLink value="/NI/add_entity/new_device.jsf">Click here to add a new device to the project</h:outputLink> </h:form> </rich:tab> <rich:tab label="WEB CHANNELS"> <h:form id="channelForm"> <h4>Click on a Channel Below To Edit It</h4> (Click on A Project To the Left to Change the Channels Listed) <br/><br/> <h:outputText value="Channels For #{updateAllBean.projectName} (ID - #{updateAllBean.projectId})" style="text-decoration:underline; font-weight:700; font-size:130%" /> <br/><br/> <rich:tree nodeSelectListener="#{updateAllBean.channelClick}" ajaxSubmitSelection="true" switchType="client" ajaxKeys="#{null}" reRender="channelId, channelName" showConnectingLines="false"> <rich:treeNodesAdaptor nodes="#{updateAllBean.channelList}" var="channel"> <rich:treeNode icon="/images/channelImg.png" iconLeaf="/images/channelImg.png"> <h:outputText value="#{channel.name}" /> </rich:treeNode> </rich:treeNodesAdaptor> </rich:tree> <br/> <h:outputText id="channelId" value="ChannelID: #{updateAllBean.channelId}" /> <br/> <h:outputText value="Channel Name:" /> <h:inputText id="channelName" value="#{updateAllBean.channelName}" size="27" /> <br/><br/> <h:commandButton type="submit" value="SUBMIT CHANNEL CHANGES" action="#{updateAllBean.updateChannel}" /> <h:outputText value=" " /> <a4j:commandButton type="reset" value="REMOVE CHANGES"/> <br/><br/><br/> <h:outputLink value="/NI/add_entity/new_channel.jsf">Click here to add a new channel to the project</h:outputLink> </h:form> </rich:tab> </rich:tabPanel> </f:view> </ui:define> </td> </tr> </table> </ui:composition> </html>
Maybe just a start would be to help me figure out where to place the a4j:push tag, Im not even sure I have been doing that right. I have been placing it right above the first a4j:commandButton, but have been wondering if it might need to actually be placed up there with the rich:tree? -
10. Re: making rich tree load new nodes after they are added to
You can put a4j:push anywhere in BODY. If you already use a4j:commandLink to refresh something, then push is not necessary. For more info refer to documentation: http://www.jboss.org/file-access/default/members/jbossrichfaces/freezone/docs/devguide/en/html/a4j_push.html
-
11. Re: making rich tree load new nodes after they are added to
yeah I have been using that already too, in addition to live demo.
I am just so new to faces that stuff like ActionListeners are very foreign to me.
I think I have it almost working though, Im definitely making progress.
Right now I have the command button set to reRender the push tag, and that push loads the treeList with new projects (including the one that was just added or edited), and then it reRenders the tree.
This works fine, except the problem now is that every time I go from page to page this method is called, so the method to load the tree has to run every. Its essentially acting as if the tree were a request scope instead of session, except expanding nodes doesnt call the method, so its at least better in that respect,
I think the solution lies in the enabled attribute for the a4j:push tag, and that is what I am working on now. -
12. Re: making rich tree load new nodes after they are added to
And I do have the a4j:commandButton set to reRender the tree, but it is refreshing the tree before the new project are loaded into the list, which is why I originally asked if it was possible to control the order of those events.
-
13. Re: making rich tree load new nodes after they are added to
Well I got this working. Its kind of clunky at times but it does the job. Here is an example of one of the pages, maybe someone can tell me how to make it more efficient? If not, at least things work for me now!
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich" xmlns:ui="http://java.sun.com/jsf/facelets"> <ui:composition template="/pages/layout.xhtml"> <ui:define name="banner"> <h:form> <h:graphicImage value="/images/NILogo.jpg" width="800" height="50" /> </h:form> </ui:define> <table> <tr> <td> <ui:define name="top_menu"> <h:form> <h:outputLink value="/NI/pages/first.jsf">MDN PROJECT EXPLORER</h:outputLink><h:outputText value=" | " /> <h:outputText value=" | " /><h:outputText value=" | " /><h:outputText value=" | " /> <h:panelGroup> <h:outputLink value="/NI/top_menu/charts.jsf" >CHARTS</h:outputLink><h:outputText value=" | " /> <h:outputLink value="/NI/top_menu/map.jsf" >MY MAP</h:outputLink><h:outputText value=" | " /> </h:panelGroup> <hr/> </h:form> </ui:define> </td> </tr> </table> <table> <tr> <td style="max-width: 20%; float: left"> <ui:define name="project_explorer"> <a4j:push interval="1000" eventProducer="#{updateAllBean.loadTree}" reRender="tree, projectForm, deviceForm, channelForm" id="push" enabled="#{updateAllBean.enabled}"/> <h:form id="treeForm"> <rich:tree nodeSelectListener="#{updateAllBean.projectSelection}" ajaxSubmitSelection="true" switchType="client" var="item" ajaxKeys="#{null}" reRender="projectForm, deviceForm, channelForm" id="tree"> <rich:treeNodesAdaptor nodes="#{updateAllBean.projects}" var="projects"> <rich:treeNode icon="/images/projectImg.png" iconLeaf="/images/projectImg.png"> <h:outputText value="#{projects.name}" /> </rich:treeNode> <rich:recursiveTreeNodesAdaptor roots="#{projects.devices}" var="devices"> <rich:treeNode icon="/images/deviceImg.png" iconLeaf="/images/deviceImg.png"> <h:outputText value="#{devices.deviceName}" /> </rich:treeNode> <rich:recursiveTreeNodesAdaptor roots="#{devices.deviceChannels}" var="channel"> <rich:treeNode icon="/images/channelImg.png" iconLeaf="/images/channelImg.png"> <h:outputText value="#{channel.name}" /> </rich:treeNode> </rich:recursiveTreeNodesAdaptor> </rich:recursiveTreeNodesAdaptor> </rich:treeNodesAdaptor> </rich:tree> </h:form> </ui:define> </td> <td style="width:85%; float: right"> <ui:define name="content"> <f:view> <rich:tabPanel switchType="client"> <rich:tab label="PROJECT"> <h:form id="projectForm"> <h4>Please Click on a Project From the Left To Edit It</h4> <br/> <h:outputText value="Project ID: #{updateAllBean.projectId}" /> <br/> <h:outputText value="Project Name: " /> <h:inputText value="#{updateAllBean.projectName}" size="27" required="true"/> <br/><br/> <h:outputText value="UserID: #{updateAllBean.userId}" /> <br/> <h:outputText value="User Permission:" /> <h:inputText value="#{updateAllBean.permission}" size="27"/> <br/><br/> <a4j:commandButton type="submit" value="SUBMIT PROJECT CHANGES" action="#{updateAllBean.updateProject}" reRender="push, treeForm, projectForm, deviceForm, channelForm" actionListener="#{updateAllBean.changeEnabled}"/> <h:outputText value=" " /> <a4j:commandButton type="reset" value="REMOVE CHANGES"/> <br/><br/><br/> <h:outputLink value="/NI/add_entity/new_device.jsf">Click here to add a new device to the project</h:outputLink> <br/><br/> <h:outputLink value="/NI/add_entity/new_channel.jsf">Click here to add a new channel to the project</h:outputLink> </h:form> </rich:tab> <rich:tab label="DEVICES"> <h:form id="deviceForm"> <h4>Click on a Device Below To Edit It</h4> (Click on A Project To the Left to Change the Devices Listed) <br/><br/> <h:outputText value="Devices For #{updateAllBean.projectName} (ID - #{updateAllBean.projectId})" style="text-decoration:underline; font-weight:700; font-size:130%" /> <br/><br/> <rich:tree nodeSelectListener="#{updateAllBean.deviceClick}" ajaxSubmitSelection="true" switchType="client" ajaxKeys="#{null}" reRender="deviceId, deviceName, deviceLat, deviceLng" showConnectingLines="false" id="deviceTree"> <rich:treeNodesAdaptor nodes="#{updateAllBean.deviceList}" var="device"> <rich:treeNode icon="/images/deviceImg.png" iconLeaf="/images/deviceImg.png"> <h:outputText value="#{device.name}" /> </rich:treeNode> </rich:treeNodesAdaptor> </rich:tree> <br/> <h:outputText id="deviceId" value="DeviceID: #{updateAllBean.deviceId}" /> <br/> <h:outputText value="Device Name:" /> <h:inputText id="deviceName" value="#{updateAllBean.deviceName}" size="27" /> <br/> <h:outputText value="Device Latitude: " /> <h:inputText id="deviceLat" value="#{updateAllBean.deviceLat}" size="27"/> <br/> <h:outputText value="Device Longitude: " /> <h:inputText id="deviceLng" value="#{updateAllBean.deviceLng}" size="27"/> <br/><br/> <a4j:commandButton type="submit" value="SUBMIT DEVICE CHANGES" action="#{updateAllBean.updateDevice}" reRender="push, treeForm, projectForm, deviceForm, channelForm" actionListener="#{updateAllBean.changeEnabled}"/> <h:outputText value=" " /> <a4j:commandButton type="reset" value="REMOVE CHANGES"/> <br/><br/><br/> <h:outputLink value="/NI/add_entity/new_channel.jsf">Click here to add a new channel to the device</h:outputLink> <br/><br/> <h:outputLink value="/NI/add_entity/new_device.jsf">Click here to add a new device to the project</h:outputLink> </h:form> </rich:tab> <rich:tab label="WEB CHANNELS"> <h:form id="channelForm"> <h4>Click on a Channel Below To Edit It</h4> (Click on A Project To the Left to Change the Channels Listed) <br/><br/> <h:outputText value="Channels For #{updateAllBean.projectName} (ID - #{updateAllBean.projectId})" style="text-decoration:underline; font-weight:700; font-size:130%" /> <br/><br/> <rich:tree nodeSelectListener="#{updateAllBean.channelClick}" ajaxSubmitSelection="true" switchType="client" ajaxKeys="#{null}" reRender="channelId, channelName" showConnectingLines="false"> <rich:treeNodesAdaptor nodes="#{updateAllBean.channelList}" var="channel"> <rich:treeNode icon="/images/channelImg.png" iconLeaf="/images/channelImg.png"> <h:outputText value="#{channel.name}" /> </rich:treeNode> </rich:treeNodesAdaptor> </rich:tree> <br/> <h:outputText id="channelId" value="ChannelID: #{updateAllBean.channelId}" /> <br/> <h:outputText value="Channel Name:" /> <h:inputText id="channelName" value="#{updateAllBean.channelName}" size="27" /> <br/><br/> <a4j:commandButton type="submit" value="SUBMIT CHANNEL CHANGES" action="#{updateAllBean.updateChannel}" reRender="push, treeForm, projectForm, deviceForm, channelForm" actionListener="#{updateAllBean.changeEnabled}"/> <h:outputText value=" " /> <a4j:commandButton type="reset" value="REMOVE CHANGES"/> <br/><br/><br/> <h:outputLink value="/NI/add_entity/new_channel.jsf">Click here to add a new channel to the project</h:outputLink> </h:form> </rich:tab> </rich:tabPanel> </f:view> </ui:define> </td> </tr> </table> </ui:composition> </html>