I have a simple example of p:tree.
<p:tree id="tree" styleClass="treeskin" value="#{TreeViewController.root}" var="node" dynamic="true" animate="true"
selectionMode="single" selection="#{TreeViewController.selectedNode}" highlight="true">
<p:ajax event="select" listener="#{TreeViewController.onNodeSelect}" update=":treeform:outputComponent"/>
<p:ajax event="expand" listener="#{TreeViewController.onNodeExpand}" />
<p:ajax event="collapse" listener="#{TreeViewController.onNodeCollapse}" />
<p:treeNode styleClass="treeskin">
<h:outputText value="#{node}"/>
</p:treeNode>
</p:tree>
I'm interested is it possible somehow when I click on a node to open a new page. I found that using onNodeClick I can open a new page using JavaScript. But if it's possible I want to send hidden value which I will use as a key later.
What are the possible solutions?
You could try embedding an <h:link/> in the <p:treeNode/>. Use the following construct
<h:link value="#{node}" outcome="destination?includeViewParams=true">
<f:param name="theParam" value="#{node.property}"/>
</h:link>
The includeViewParams=true bit is going to ensure the parameter you're trying to pass makes it across the request to the next page
Related
I am working with javaEE, and for my project i used TreeTable and BlockUI to block this table, but i want to make a button appear even if it is blocked
<p:blockUI block=":form:treeTable" widgetVar="tbd" blocked="#{ManagedBean.condition}" />
<h:form id="form">
<p:treeTable id="treeTable" ... >
<f:facet name="header">
<p:commandButton value="SomeAction" actionListener="#{ManagedBean.someAction}" update=":form"/>
</f:facet>
in my example i want to make my commanbutton appear as available even if i use BlockUI
thantk you
This is not a functional problem but a design problem.
As is, the CommandButton is part of the TreeTable, so the CommandButton must be blocked if the TreeTable is blocked.
For sure Raziels answer will work, but a clean solution would be to move the button out of the TreeTable.
<h:form id="form">
<p:commandButton
value="SomeAction"
actionListener="#{ManagedBean.someAction}"
update=":form"
/>
<p:treeTable
id="treeTable"
...
/>
<p:blockUI
block=":form:treeTable"
widgetVar="tbd"
blocked="#{ManagedBean.condition}"
/>
</h:form>
I already Solved this problem by using z-index:99999 inside a style tag
so your code should be like :
<p:blockUI block=":form:treeTable" widgetVar="tbd" blocked="# {ManagedBean.condition}" />
<h:form id="form">
<p:treeTable id="treeTable" ... >
<f:facet name="header">
<p:commandButton value="SomeAction" style="z-index: 99999" actionListener="#{ManagedBean.someAction}" update=":form"/>
</f:facet>
I have a setup in a view, where I display datatables dynamically. That is happening inside a p:accordion-Element, which is generating the tabs dynamically (and therefore the datatables inside).
The user now has the possibility (well, should have..) to add, edit and remove objects to the datatable and therefore to the object that is represented by the tab.
The add- and edit-functions work via dialogs. After successful adding or editing I want to update the datatable containing the data.
If I update the whole accordion-panel I lose the focus on the current tab which is really bad for the user-experience, especially because the other sub-pages of the project always only update the datatable.
After some googling I found out that I can't generate the IDs of JSF-components dynamically, what would make the whole thing a process of minutes.
I also do not have any index I could use to "cheat" and save in my backing-bean when I open the dialog.
I also found out that I could work-around this issue by using JSTL but this is prohibited due to a limited set of allowed languages.
The current setup looks like this:
<p:accordionPanel id="academicYearAccordionPanel"
value="#{academicYearAndClassController.academicYears}"
var="academicYear" multiple="true" dynamic="true" activeIndex="-1"
style="width:100%;">
<p:tab id="academicYear-#{academicYear.academicYear}" title="Jahrgang - #{academicYear.academicYear}">
<p:outputPanel style="float:right">
<p:commandButton value="Löschen" icon="ui-icon-close"
actionListener="#{academicYearAndClassController.setAcademicYear(academicYear)}"
process="#this"
oncomplete="PF('wConfirmAcademicYearDelete').show();">
</p:commandButton>
</p:outputPanel>
<p:spacer style="height:50px;" />
<p:separator />
<!-- Tabcontent -->
<p:outputPanel>
<p:outputPanel style="float:right">
<p:commandButton value="Hinzufügen" icon="ui-icon-plusthick"
actionListener="#{academicYearAndClassController.setAcademicYear(academicYear)}"
process="#this"
oncomplete="PF('wAddSchoolclassDialog').show();">
</p:commandButton>
</p:outputPanel>
<h:panelGrid columns="2">
<h:outputText
value="Klassen des #{academicYear.academicYear}. Jahrgangs" />
<p:spacer style="height:50px;" />
</h:panelGrid>
<p:dataTable emptyMessage="Keine Klassen vorhanden"
id="schoolclassTable"
var="schoolclass"
selection="#{academicYearAndClassController.schoolclass}"
value="#{academicYearAndClassController.getSchoolclasses(academicYear)}"
selectionMode="single" rowKey="#{schoolclass.name}"
scrollable="true" scrollHeight="500">
<p:column headerText="Name">
<h:outputText value="#{schoolclass.identifier}" />
</p:column>
<p:column headerText="Klassenlehrkraft">
<h:outputText
value="#{schoolclass.teacher.name} (#{schoolclass.teacher.symbol})" />
</p:column>
<p:column headerText="Klassenraum">
<h:outputText
value="#{schoolclass.room.name} (#{schoolclass.room.locationName})" />
</p:column>
</p:dataTable>
</p:outputPanel>
</p:tab>
</p:accordionPanel>
I want to update the element with the ID schoolclassTable. How can I achieve this?
I would like to update a component without processing it. I use a binding get the value of a checkbox and decide if the other component should be rendered. Unfortunately, the update? or the binding? doesn't work as i would.
<p:selectBooleanCheckbox id="isPercentage" value="#{myBean.isDiscountInPercentage}"
label="Percentage" binding="#{discountInPercentage}">
<p:ajax process="" update="outpDiscountValue" />
</p:selectBooleanCheckbox>
<p:outputPanel id="outpDiscountValue">
<h:outputLabel value="$" rendered="#{!discountInPercentage.value}" />
<h:outputLabel value="%" rendered="#{discountInPercentage.value}" />
</p:outputPanel>
I have a JSF page using richfaces with a few help buttons like this:
<rich:componentControl for="panelHelp" event="oncomplete" operation="show" />
The panel called is this:
<rich:modalPanel id="panelHelp" minHeight="250" minWidth="500"
keepVisualState="true" resizeable="true" moveable="true">
<f:facet name="header">
<h:outputText value="Help" />
</f:facet>
<f:facet name="controls">
<h:commandLink value="">
<h:graphicImage value="/close2.png" title="Close" />
<rich:componentControl for="panelHelp" event="onclick" operation="hide" />
</h:commandLink>
</f:facet>
<h:panelGrid columns="1" width="100%">
<h:outputText escape="false" id="txtHelp"
value="#{msgHelp}" style="width: 100%; height: 190px" />
</h:panelGrid>
</rich:modalPanel>
However, whenever I press the button to close the panel, it reloads the whole page, instead of simply hiding the panel.
Am I doing something wrong, or is there a better way to do this?
I'm using richfaces version 3.3.3
Use a4j:commandLink instead of h:commandLink and provide an a4j:support as well. This should fix the problem.
It's reloading the entire page because of your use of the <h:commandLink/>, which is going to trigger the entire JSF request processing lifecycle. To get your desired results you don't need the command link component. All you really need is:
<f:facet name="controls">
<h:graphicImage id="closeButton" value="/close2.png" title="Close" />
<rich:componentControl attachTo="closeButton" for="panelHelp" event="onclick" operation="hide" />
</f:facet>
What we're doing here is firing the <rich:componentControl/> on click of the image; there's no need for a link. I'm assuming you're using Richfaces 3.X. (RF 4.X has deprecated the attachTo attribute)
Above answer will work in Richfaces 3.x, If you are using Richfaces 4.x then the given code will work.
<f:facet name="controls">
<h:graphicImage value="/close2.png" >
<rich:componentControl target="closeButton" operation="hide" event="click" />
</h:graphicImage>
</f:facet>
Add disableDefault="true" attribute to your rich:componentControl to disable default behavior of the link on click.
I am using primefaces 3.0 M2, and I use DefaultTreeNode, with the component p:tree and it works fine.
My problem is that I want the value of node selected were be different from the the value of node displayed.
Need your help please!
You may display any text you like for each node. For example, this is a bit changed example from primefaces showcase (TreeBeen.java is the same):
<h:form>
<p:growl id="growl" showDetail="true" />
<p:tree id="treeSingle" value="#{treeBean.root}" var="node"
selectionMode="single" selection="#{treeBean.selectedNode}">
<p:treeNode>
<h:outputText value="Node" />
</p:treeNode>
</p:tree>
<p:commandButton value="Display Selected" update="growl"
actionListener="#{treeBean.displaySelectedSingle}" />
</h:form>
"Node" text is displayed for each node, but it's data value is displayed on button click event.