p:commandButton update doesn't work in ui:include
I want to update a part of a page by PPR. This is the part of page that i want to update:
<h:panelGroup id="aggiungiAuto"
rendered="#{!autoBean.operazioneOk}">
<ui:include src="../component/aggiungi_auto.xhtml"/>
</h:panelGroup>
While this is the commandButton present in aggiungi_auto.xhtml
<p:commandButton value="Submit"
update="growl aggiungiAuto aggiungiFoto"
actionListener="#{autoBean.开发者_运维技巧insert}"/>
Any Idea?
JS/Ajax works on the client side, not on the server side. JSF works on the server side, not on the client side. When you instruct JSF to not render the component to HTML, then nothing will be present in the client side, so JS/Ajax will be unable to locate the HTML element to refresh/update.
You need to wrap it in another <h:panelGroup>
.
<h:panelGroup id="aggiungiAuto">
<h:panelGroup rendered="#{!autoBean.operazioneOk}">
<ui:include src="../component/aggiungi_auto.xhtml"/>
</h:panelGroup>
</h:panelGroup>
This way the <span id="aggiuniAuto">
is always present in the client side, so JS/Ajax will be able to update it with the new HTML data generated by JSF.
So I was having this kind of a problem with PrimeFaces (the above answer not being sufficient this time), and I also discovered a solution.
Part of the problem I think was that I was using ui:include
recursively. For whatever reason, PrimeFaces was irrationally causing UI components to be bound to the backend data out-of-sync; e.g., when an "Add" button was clicked, a new value would be created in the UI, but then the data for it would be ripped out of the values for the section below, etc...
The explanation? "[O]n a viewscoped bean, a hidden field is added to the form to hold post-back data[;] if that field is not included with the process, then the bean will lose context." This particular problem is prevalent with ui:include
recursion especially. Solution (all regarding the p:commandButton
or other actionable component):
- Ensure that
update
andprocess
are pointing to a JSF component, not a regular HTML component. update
the next scope up if it breaks (goes out-of-sync with the binding).- Use
styleClass
's for update (not e.g. PF ID's or@this:@parent
kind of stuff), so that jQuery is utilized instead of PF, e.g.:@(.fieldset-class)
. process
whatever scope is being updated. (This is needed for the post-back data so that the Bean keeps its context for the update...)process="@this"
is not needed here, provided that the button is contained by the process value component.- For all buttons without validation wanted, set
immediate="true"
. - If none of the above works (which happened with the Add buttons, probably due to
ui:include
recursion), setprocess="@this"
,immediate="true"
, andupdate="@none"
, and thenoncomplete="remoteCommandName();"
, and have ap:remoteCommand
instead with that name with theprocess
,immediate
, andupdate
mentioned in the above points. - If none of the above works (which happened with some other buttons, probably due to being yet another layer deeper in the
ui:include
recursion)... wrap ah:panelGroup
around the nextc:forEach
up and then update the PrimeFaces ID of that in the button itself while keeping itsremoteCommand
call afterwards, as specified above. - If none of the above works (which happened yet again to me)... Try the following code:
- In the
p:commandButton(s)
:oncomplete="$('.FixButtonSC').click();"
- In the
p:fieldset
with a style class of FieldsetSC:
- In the
<!-- Fix (hidden) button. -->
<p:commandButton id="FixButton" styleClass="FixButtonSC"
process="@this" update="@(.FieldsetSC)" style="display: none;" />
Hope that helps...
精彩评论