I am developing an application in JSF. My page has been divided into 3 layouts. Menu bar will be displayed at left side and content will be shown at center of the page. I want menu bar in all pages throughout the application. Now i have achieved it using templates. But its reloading the entire page while clicking the menu items.
Is there any other option to display the content in the content area without reloading the entire page?
Thanks.
I have faced similar issues in my application. You have to use <f:ajax> within your menu item and render only the div you want refresh.
e.g.
<f:ajax render="idOfDivToRefresh" />
Related
As title stated, I want to put icon and badge beside the title of submenu of Panel Menu. However, Primefaces' submenu default icon is the expand arrow/triangle. When I do this:
<p:badge value="2">
<p:submenu icon="pi pi-envelope">
</p:badge>
It will prompt error, and doing vice versa like wrapping badge and closing using </p:submenu> is impossible because there are menuitems also. Not to mention the icon is not showing.
So, can I really achieve this using free open source provided? Or this is exclusive to paid user only?
Example from Primefaces template
Badges are not supported on (sub)menu items at this moment (PrimeFaces 11). No matter if you use a free or paid theme. The only component that currently supports a badge on a child node is p:speedDial. What you can do is open a feature request and if possible submit a pull request.
See also:
https://github.com/primefaces/primefaces/issues/7898
https://github.com/primefaces/primefaces/pull/7922
I have numerous AccordionPanel in my jsf page.
<p:accordionPanel multiple="true" id="HomeAddress">
so everytime we add new accordion panel and load the page, it is taking long time to load all the panel.So I want to lazy load the panels. At first load five panel and once we scroll to the end it will load rest of the panels. Something like happening in all e-commerce site (Flipkart, Amazon etc..)
An accordionPanel is one componenent and like most complex PF components, it does not allow updating one of it's children or dynamicaly adding one (tabs in this case). And dynamicaly loading is an even different thing. You can achieve this by adding an
<p:outputPanel deferred="true" deferredMode="visible">...
</p:outputPanel>
inside each tab and put the content in there. But adding a tab to the accordionpanel will still reload all tabs, lazy, ok, but still reload them when accessed
I am using a master template (i.e. <ui:composition template> / <ui:define>) where I have a navigation panel on the left, and the content panel in the center. When I go to one of my pages that is #ViewScoped, I edit some of the fields, go to another page which reloads the content area, and then go back to the original page, and the fields are all still populated with data. This implies that the view never ended. I tried #RequestScoped which produces the results I want, but breaks all of the ajax in the page related to that bean.
What is the best way to reset a page to its original state?
Can anyone see what is happening, exactly, regarding my layout and content area (consisting of a ui:include) being updated that would cause this not to be considered a change of View?
By navigating the content of the page using a backing bean, a ui:include updated by ajax, all in the same page, JSF's current view never goes out of scope, which is why the backing ViewScoped beans are never reset after navigating.
One possible fix for this is to redesign the page to use traditional navigation. In other words, lets say you have several p:menuitems. Rather than assigning the actionListener to some backing bean function that sets the content page (followed by an update of the panel containing the ui:include), you would set the "action" of each menuitem to the page to which each corresponds. This has the effect of causing a page to be loaded when a menuitem is clicked.
This generated the requirement that I had to reorganize my template a little so that every page of my site was embedded in it. There's a little bit of flicker as the entire page reloads, but the beans are being reset accordingly.
I have a JSF Portlet which has user form in the view JSP. The requirement is whenever i click on the theme navigation menu, a new form needs to be displayed to the user. But the problem is whenever i click on the menu, the values are getting retained. Please suggest how to the remove/re-initialize the backing bean on click of theme navigation.
Thanks,
Raj
I did a workaround by adding a queryString parameter to the navigation URL generation (since we are using custome themes) and in my doView i am checking for the parameter and if its not NULL, then display a fresh form. Hope it helps
I have a a4j:commandButton in a iframe and a a4j:outputPanel where both of the iframe and the panel resides in a same page. Is it possible to reRender that panel on that button click?
Thanks.
It looks to be not possible to be done using standard JSF+A4J approach. The content inside of iframe is build by a separate request to separate view, so it has its own JSF components tree. So a4j:commandButton and a4j:outputPanel are in different views (different components trees), and it is not possible to do 'cross-tree' rerender.
To access parent page from iframe you can try using JavaScript.
For example put to parent page jsFunction, like this:
<a4j:jsFunction name="reRenderPanel" reRender="panelId"/>
And in iframe add the following onclick javascript to commandButton:
<a4j:commandButton onclick="parent.reRenderPanel();"/>