i have a p:treeTable in a form and a p:dialog in another form where from p:dialog i add data to the p:treeTable
on submit of h:commandButton of the dialog i add update of p:treeTable in orded to see the added node
The issue is that all expanded nodes the user has opened will all collapse
I found this question Avoiding the collapsing of p:treeTable after update which in the question he wrote solved but no answer or solution for his question
To avoid collapsing or expanding you have to mark your node on the java side as collapsed or expanded. To do that that just add some ajax calls and some listener methods.
JSF/Faces:
<p:tree ...>
<p:ajax event="expand" listener="#{backing.nodeExpand}" />
<p:ajax event="collapse" listener="#{backing.nodeCollapse}" />
...
</p:tree>
Java/Backing:
public void nodeExpand(NodeExpandEvent event) {
event.getTreeNode().setExpanded(true);
}
public void nodeCollapse(NodeCollapseEvent event) {
event.getTreeNode().setExpanded(false);
}
According to PrimeFaces Tree Events Showcase you forgot to use the update statement.
If you try call any action or actionListener inside the tree you need expend all node and parents, with you don't do you this only don't work and don't show any error.
node.setExpanded(true);
node.getParent().setExpanded(true);
Related
"anymore" is definitely a key word here. I had this working, and even after comparing my previous revisions, I cannot see a smoking gun.
I have placed an accordion in the navigation panel on the West side of my layout. I have overridden the actionListener to call a remoteCommand, like this.
<p:accordionPanel widgetVar="tabPanel"
dynamic="true" cache="true"
activeIndex="-1"
actionListener="tabChange()">
<p:remoteCommand name="tabChange"
process="#this"
update=":contentPanel"
actionListener="#{viewSelectionBean.changeView}" />
When clicking on any given tab, it used to call the backing bean method changeView, which sets the html page being shown in ":contentPanel", but now I get no backing bean action. I have commandLinks within each of these accordion tabs that also call changeView successfully. Its only the tabChange() that doesn't seem to be called.
actionListener is not a property of accordionPanel, therefore, thats why it wouldn't be called. This feature can be made to work using ajax, but it demonstrates lag while expanding each tab. Lag aside, one might also have success overriding onTabChange of the accordionPanel, but that will force you to have to manually effect the activeIndex, and the expanding of tabs.
<p:accordionPanel widgetVar="tabPanel"
dynamic="true" cache="true"
activeIndex="-1">
<p:ajax event="tabChange"
listener="#{viewSelectionBean.onTabChange}"
update=":contentPanel"
process="#this"
partialSubmit="true"/>
I have the following scenario :
Page.xhtml (p:selectCheckBoxMenu id=sb1)
From page.xhtml I call genericDialog.xhtml
genericDialog.xhtml (Composite implementation with p:dialog,etc...)
From genericDialog.xhtml how can I process and update via p:ajax the sb1 component.
Error : javax.faces.FacesException: Cannot find component with identifier "formPessoa:tipoMercado" referenced from "j_idt440:myForm:confirm"
From the left side of image in green color I have my composite p:dialog (genericDialog.xhtml)
From the right side of image I have in red the selectCheckBoxMenu id=sb1 which I need to reload after saving new data from dialog.
thanks a lot stack members.
After a lot of time to me.... I figured out the issue:
<p:commandButton id="confirm" value="#{cc.attrs.labelbotao1}"
oncomplete="#{cc.attrs.oncompletebotao1}" update="myForm:divmessage"
actionListener="#{cc.attrs.actionbeanbotao1}" **ajax="true"**>
<p:ajax update="#{cc.attrs.ajaxupdate1}" process="#{cc.attrs.ajaxprocess1}"
listener="#{cc.attrs.listener1}" />
</p:commandButton>
Two problems:
First I need to reference in the composition genericDialog.xhtml the full path to update the component e.g. myform: sb1
Second the AJAX on p: commandButton has to be false. This way it does not cancel the p: AJAX update and process.
I'd like to hear some other opinions or fixes, etc.
How can I use an AJAX listener inside a tabview. Whenever the tab opened(or for a mouse click anywhere), the listener need to execute. I tried with event=click,change,blur etc, but not worked.
<p:tabView activeIndex="#{backingbean.tanIndex}">
<p:ajax event="?" listener="#{backingbean.setTabIndex}" />
in view.jsf:
<p:tabView>
<p:ajax event="tabChange" listener="#{employeeEdit.onTabChange}">
in edit.jsf:
<p:tabView activeIndex="#{employeeEdit.tabIndex}">
in backingBean:
private int tabIndex;
public int onTabChange(TabChangeEvent event)
{
// Here I'm getting event.getTab().getId() and set it to `tabIndex` property.
}
When editing I need redirect to the that tab which is active in view. So if I didn't change the tab onTabChange() will not execute and tabIndex has its old value only.
I'm using Primefaces version-3.0.M3.
It looks like this was a Primefaces bug that was fixed in the newest 3.0.1 release:
http://forum.primefaces.org/viewtopic.php?f=3&t=17288
I had a similar problem with Primefaces 5.1
As long as i put the tabview into a form everything worked fine.
But because i wanted to use seperate forms in my tabs i had to remove the surrounding form of the tabview to avoid nested forms.
Without the surrounding form the ajax event didn´t get triggered any more when changing the tab.
My solution was to use a remotecommand in a form parallel to the tabview.
The remotecommand is triggered by the onTabChange attribute of the tabview element.
At that call i forwarded the index parameter to the global request parameters.
<p:tabView id="rootTabMenu" styleClass="tabcontainer" prependId="false"
activeIndex="#{sessionData.activeTabIndex}" widgetVar="rootTabMenu"
onTabChange="tabChangeHelper([{name: 'activeIndex', value: index}])">
// Tabs...
</p:tabView>
<h:form id="tabChangeHelperForm">
<p:remoteCommand name="tabChangeHelper" actionListener="#{sessionData.onTabChange()}" />
</h:form>
In the backing bean i catched the value again from the request parameter map and set the active index.
public void onTabChange()
{
FacesContext context = FacesContext.getCurrentInstance();
Map<String, String> paramMap = context.getExternalContext().getRequestParameterMap();
String paramIndex = paramMap.get("activeIndex");
setActiveTabIndex(Integer.valueOf(paramIndex));
System.out.println("Active index changed to " + activeTabIndex);
}
Hope that can help you
Not sure if what I am writing is true for ver 3.0.M3. I have in front of the documentation of ver 3.0RC2 and there is a paragraph about this, with explaination and sample code (chapter TabView, paragraph Ajax Behaviour Events). You should have a look at that.
This is the part of the sample code that should help most:
<p:tabView>
<p:ajax event=”tabChange” listener=”#{bean.onChange}” />
</p:tabView>
Jaron has an answer that the 3.0.1 release fixed this but I had this all the way up to 3.5 i believe i was still having this problem. on firefox and IE, the javascript handler for the Tabs weren't firing the ajax event. On google chrome, for whatever reason, it actually worked.
I moved up to Primefaces 5.0 today and this does NOT have the problem any longer. So at the very worst-case, go to Primefaces 5.0 and you'll be all good in the hood
How does this code in the PrimeFaces DataTable row selection work?
<p:commandButton update=":form:display" oncomplete="confirmation.show()" image="ui-icon ui-icon-close" title="Delete">
<f:setPropertyActionListener value="#{car}" target="#{tableBean.selectedCar}" />
</p:commandButton>
I am confused by the following: update=":form:display", and image="ui-icon ui-icon-close".
Is this inbuilt into Primefaces? or do I need to create an additional form, or have an external image mapped to it?
update=":form:display" refers to a specific element on the page. The first ':' goes to the root of the page, so there needs to be a component with the id "form" (probably a form) and inside that a component with the id "display". This means after the button actions has completed :form:display will be updated. Note that it's generally not a great idea to use absolute paths as they can be hard to keep up to date when you change the page structure. If the button is on the same level as the "display" component you could just do update="display", or you can do things like update="#form" to update the entire current form.
image="ui-icon ui-icon-close" refers to style classes in your css. These two comes predefined with primeface, but if you want to use custom graphics you can also define your own style classes for them.
I have a tree that is used as menu, so every node is clickable and opens another *.xhtml file. The tree is displayed on every *.xhtml file with templates.
Problem: the tree collapses if redirect to a *.xhtml file. Surprisingly, the selected node stays selected (it is colored as selected). The tree shouldn't collapse!
The tree is generated dynamic, but it is only generated once.
Tested with Primefaces 2.2.1 and 3.0.M2
How can I solve this problem? At primefaces showcase this works.
My code:
<h:form id="formTreeStudents">
<p:tree id="treeGroups"
value="#{studentTree.root}"
var="node"
cache="true"
selectionMode="single"
nodeSelectListener="#{studentTree.onNodeSelect}"
selection="#{studentrTree.selectedNode}"
onselectComplete="ajaxDialog.show();"
update="statusbar userbar">
<p:treeNode>
<h:outputText value="#{node.treeString}" styleClass="treeNodeParent"/>
</p:treeNode>
</p:tree>
<p:ajax event="load" onstart="ajaxDialog.hide();"/>
</h:form>
The bakingBean is sessionScoped. It has getter and setter similar to the example at primefaces showcase and a listener function.
#ManagedBean
#SessionScoped
public class StudentTree implements Serializable{
...
public void onNodeSelect(NodeSelectEvent event) {
...
}
}
The tree node stays selected because the property #{studentrTree.selectedNode} of the managed bean has a value.
Your managed bean is #SessionScoped so it will live in session even after you navigate away from and back to the page. If you were to change it to #ViewScoped then the managed bean will die when navigating away from the page, and when you navigate back to the page the property selectedNode will be its default value again.
solved it.
it works with Primefaces 3.0.M2. Something was wrong with my libraries or with cached data.
Some changes had to be done to use 3.0.M2.
f.e.:
nodeSelectListener="#{studentTree.onNodeSelect}"
is now replaced with
<p:ajax event="select" listener="#{studentTree.onNodeSelect}"/>