JSF rerender clears html code added onload - jsf

I add a checkbox in front of specific components like dropdowns on page load. When a particular dropdown on change reRenders the a4j:outputPanel which has the checkbox, the checkox disappears. Is it because of the view being created and then I have added the checkbox. OR the a4j:outputPanel is the cause. I cannot remove the panel. Can anyone please guide me?
P.S : If I dont reRender the a4j:outputPanel the checkbox remains. But I need to reRender the panel.

The reason it disappears is that as you said it is added using javascript. When you render an element using jsf + ajax the element is created from the response from server. As the server knows nothing about your onload code, it removes the element and recreates it with response from server.

Related

Is loading triggered from the click of a submit button generated by h:commandButton a full load?

A jsf page contains a form with a commandButton element like <h:commandButton action="#{bean.search}". This submit button will trigger a bean, which then will send more data back to this same jsf page.
Question: after the submit, is the jsf page fully loaded again? or is just the part containing the newly retrieved data reload and other parts are not loaded again?
By default JSF will fully reload the page. This can be tested by looking at the browser network developer tools while submitting the commandButton. If you intend to only render a part of the page - e.g. a label that outputs the result - you can do that by using AJAX.
For example if your commandButton is in a form, by adding
<f:ajax execute="#form" render="#form:result" />
within your commandButton tag, you can specify that only the contents of the form are processed by the server and only the label with the ID 'result' is rendered.
For further information take a look at this guide for AJAX in JSF: https://www.beyondjava.net/a-comprehensive-guide-to-jsf-ajax
You will see that the author shows the full page loading without AJAX.
Alternatively here is the official documentation for <f:ajax>:
https://jakarta.ee/specifications/faces/2.3/vdldoc/f/ajax.html

PrimeFaces DataTable which is inside OverlayPanel stops working when OverlayPanel is used inside Dialog

Here is my scenario. Room Object have ManyToOne relationship with Tax Object. There are two pages for Room, Create New and List All.
At Create New Page, there is Tax Field. I use OverlayPanel + DataTable + SelectEvent to assign Tax Object instead of using AutoComplete or SelectOneMenu. Everything works great at this page.
At List All Page, I use Pop-up Dialog to edit the desired record. OverlayPanel + DataTable not working anymore because OverlayPanel is inside the Dialog. SelectEvent still calls Tax Setter Method but value is null.
I use PrimeFaces 3.5 and looking for solutions that will work with PrimeFaces 3.5 only. Thanks for any help!
I think OverlayPanel (DataTable inside) is not compatible with Dialog. Using Dialog again instead of OverlayPanel solved the problem. Dialog inside Dialog works fine. I have to add appendToBody="true" attribute to child Dialog because UI is blocked. I use PrimeFaces 3.5 and works for me.

Disable dynamically created button from managed bean

I have a problem with dynamicaly created CommandButton in Primefaces.
I want to disable button after user click (submit). I've tried in two ways:
By adding widgetWar (commandButton.setWidgetVar("pony");) property to my commandButton and setting onclick behaviour (commandButton.setOnclick("PF('pony').disable();");). WidgetVar property is unique among all elements on page. This approach doesn't work - my button after click turns into disable and then immediately goes back to enable.
From managedBean by calling setDisabled method on button UiComponent ((CommandButton) component).setDisabled(true);. This also doesn't work.
Is there any other way to disable CommandButton from Java code or am I missing something?
I'm generating my page dynamically so I cannot use disabled property in xhtml.
I also set my commandButton update property to update parent p:outputPanel.
Thanks in advance.
my button after click turns into disable and then immediately goes back to enable.
That will happen if the ajax update covers the button itself. Just exclude the button from it and specify only the parts which really need to be updated.
you can a declare field in your bean
boolean disable = false;
after click on button in your listener:
disable = true;
in your button use this code:
<p:commandButton id="x" disabled="#{bean.disable}" update="#form:x" />

How to move within only one part of the page

I have read many answers written mainly by BalusC but still no luck.
So I included via ajax rendering, a page in the part of the main page and it works perfect, whenever I click the button on the main bar the subpage xhtml is shown in the proper place. Now the problem is that i want to implement in that subpage a "selectOneMenu" so whenever a user clicks on one of the options he will be redirected to another xhtml which should appear on the same part of the page (instead of the previous page). I have already thought of many ideas to solve that(including conditional rendering), but I believe that there has to be much simpler and more correct way to solve it. Maybe JSF has some kind of container tag which could be used?
PS
By the way that is my first post so sorry if I didnt make something clear.
UPDATE
It appeared to me that maybe I should somehow use ajax onValueChange which would read the value (via the actionListener ?) so when the user clicks on subpage the main page would read the value and render part with the new content. Is that even possible?
You can use valueChange Listener to get the new value and in your bean using FacesContext you can redirect the page but make sure that you add ajax call to your selectonemenu if you dont want your page to refreshed.
<h:selectOneMenu value="#{some.value}"
valueChangeListener="#{some.valuechanged}">
<f:ajax event="change" listener="#{some.listen}" />
</h:selectOneMenu>

JSF component is not getting reloaded for page refresh

I am new to JSF framework and Facelets as view, I am stuck with a problem now. I have got a page where i show some dropdown menu using <h:selectOneMenu> tag. On each selection i used to fire an ajax event using <f:ajax> event it all are working fine. But my problem is, if i select an option 2 on a select box and if I reloads the page again that particular select box will be selected with option 2 by default. I dont need this. I have to reload the select boxes along with page refresh. Please help me to solve this issue.
The selectbox shows the option that is set in the backing bean (and bound by the value attribute of <h:selectOneMenu>). The behavior after a page refresh depends on the scope of your backing bean. If it is session scoped, a page refresh doesn't reset the bean. You could change the scope to #ViewScoped to get the desired behavior. The bean then will be recreated after a full request.
Just set null to backing bean property that used in selectonemenu value after the selected action or set default value in property get method.

Resources