Conditionally render a component based on selectOneMenu value

Just check the dropdown menu’s value in the rendered attribute of the target components and update their common parent by a <f:ajax>. Here’s a kickoff example: <h:selectOneMenu value=”#{bean.item}”> <f:selectItem itemValue=”one” /> <f:selectItem itemValue=”two” /> <f:selectItem itemValue=”three” /> <f:ajax render=”results” /> </h:selectOneMenu> <h:panelGroup id=”results”> <h:panelGroup rendered=”#{bean.item eq ‘one’}”> You have selected “one”. </h:panelGroup> <h:panelGroup rendered=”#{bean.item eq … Read more

Conditional rendering of non-JSF components (plain vanilla HTML and template text)

I cannot use <h:panelGroup> as it will render to <span> or <div> Apparently you didn’t test it carefully. The <h:panelGroup> won’t render anything if you don’t specify attributes which should end up in the client side, like layout, id, styleClass, etc. Thus, this should technically perfectly work fine. <h:panelGroup rendered=”#{negotiator.maySend}”> <tr> my tr stuff </tr> … Read more

How to conditionally render plain HTML elements like s?

The right JSF component to represent a HTML <div> element is the <h:panelGroup> with the layout attribute set to block. So, this should do: <h:panelGroup layout=”block” … rendered=”#{someCondition}”> … </h:panelGroup> Alternatively, wrap it in an <ui:fragment>: <ui:fragment rendered=”#{someCondition}”> <div> … </div> </ui:fragment> Or when you’re already on JSF 2.2+, make it a passthrough element: <div … Read more

Conditionally displaying JSF components

Yes, use the rendered attribute. <h:form rendered=”#{some boolean condition}”> You usually tie it to the model rather than letting the model grab the component and manipulate it. E.g. <h:form rendered=”#{bean.booleanValue}” /> <h:form rendered=”#{bean.intValue gt 10}” /> <h:form rendered=”#{bean.objectValue eq null}” /> <h:form rendered=”#{bean.stringValue ne ‘someValue’}” /> <h:form rendered=”#{not empty bean.collectionValue}” /> <h:form rendered=”#{not bean.booleanValue and … Read more

Why do I need to nest a component with rendered=”#{some}” in another component when I want to ajax-update it?

Ajax updating is performed by JavaScript language in the client side. All which JavaScript has access to is the HTML DOM tree. If JSF does not render any component to the HTML output, then there’s nothing in the HTML DOM tree which can be obtained by JavaScript upon Ajax update. JavaScript cannot get the desired … Read more

Ajax update/render does not work on a component which has rendered attribute

It’s not possible to re-render (update) a component by ajax if the component itself is not rendered in first place. The component must be always rendered before ajax can re-render it. Ajax is using JavaScript document.getElementById() to find the component which needs to be updated. But if JSF hasn’t rendered the component in first place, … Read more