Understanding PrimeFaces process/update and JSF f:ajax execute/render attributes -
what process
, update
in primefaces p:commandxxx
components , execute
, render
in f:ajax
tag?
which works @ time of validation? update
attribute rather updating value component end? process
attribute bind value model? @this
, @parent
, @all
, @form
in both attributes?
the example below working fine, little confused in basic concepts.
<p:commandbutton process="@parent" update="@form" action="#{bean.submit}" value="submit" />
<p:commandxxx process>
<p:ajax process>
<f:ajax execute>
the process
attribute server side , can affect uicomponent
s implementing editablevalueholder
(input fields) or actionsource
(command fields). process
attribute tells jsf, using space-separated list of client ids, components must processed through entire jsf lifecycle upon (partial) form submit.
jsf apply request values (finding http request parameter based on component's own client id , either setting submitted value in case of editablevalueholder
components or queueing new actionevent
in case of actionsource
components), perform conversion, validation , updating model values (editablevalueholder
components only) , invoke queued actionevent
(actionsource
components only). jsf skip processing of other components not covered process
attribute. also, components rendered
attribute evaluates false
during apply request values phase skipped part of safeguard against tampered requests.
note it's in case of actionsource
components (such <p:commandbutton>
) important include component in process
attribute, particularly if intend invoke action associated component. below example intends process input component(s) when command component invoked ain't gonna work:
<p:inputtext id="foo" value="#{bean.foo}" /> <p:commandbutton process="foo" action="#{bean.action}" />
it process #{bean.foo}
, not #{bean.action}
. you'd need include command component well:
<p:inputtext id="foo" value="#{bean.foo}" /> <p:commandbutton process="@this foo" action="#{bean.action}" />
or, apparently found out, using @parent
if happen components having common parent:
<p:panel><!-- type doesn't matter, long it's common parent. --> <p:inputtext id="foo" value="#{bean.foo}" /> <p:commandbutton process="@parent" action="#{bean.action}" /> </p:panel>
or, if both happen components of parent uiform
component, can use @form
:
<h:form> <p:inputtext id="foo" value="#{bean.foo}" /> <p:commandbutton process="@form" action="#{bean.action}" /> </h:form>
this undesirable if form contains more input components you'd skip in processing, more in cases when you'd update input component(s) or ui section based on current input component in ajax listener method. namely don't want validation errors on other input components preventing ajax listener method being executed.
then there's @all
. has no special effect in process
attribute, in update
attribute. process="@all"
behaves same process="@form"
. html doesn't support submitting multiple forms @ once anyway.
there's way @none
may useful in case absolutely don't need process anything, only want update specific parts via update
, particularly sections content doesn't depend on submitted values or action listeners.
the standard jsf equivalent primefaces specific process
execute
<f:ajax execute>
. behaves same except doesn't support comma-separated string while primefaces 1 (although recommend stick space-separated convention), nor @parent
keyword. also, may useful know <p:commandxxx process>
defaults @form
while <p:ajax process>
, <f:ajax execute>
defaults @this
. finally, it's useful know process
supports so-called "primefaces selectors", see how primefaces selectors in update="@(.myclass)" work?
<p:commandxxx update>
<p:ajax update>
<f:ajax render>
the update
attribute client side , can affect html representation of uicomponent
s. update
attribute tells javascript (the 1 responsible handling ajax request/response), using space-separated list of client ids, parts in html dom tree need updated response form submit.
jsf prepare right ajax response that, containing only requested parts update. jsf skip other components not covered update
attribute in ajax response, hereby keeping response payload small. also, components rendered
attribute evaluates false
during render response phase skipped. note though return true
, javascript cannot update in html dom tree if false
. you'd need wrap or update parent instead. see ajax update/render not work on component has rendered attribute.
usually, you'd update only components really need "refreshed" in client side upon (partial) form submit. example below updates entire parent form via @form
:
<h:form> <p:inputtext id="foo" value="#{bean.foo}" required="true" /> <p:message id="foo_m" for="foo" /> <p:inputtext id="bar" value="#{bean.bar}" required="true" /> <p:message id="bar_m" for="bar" /> <p:commandbutton action="#{bean.action}" update="@form" /> </h:form>
(note process
attribute omitted defaults @form
already)
whilst may work fine, update of input , command components in particular example unnecessary. unless change model values foo
, bar
inside action
method (which in turn unintuitive in ux perspective), there's no point of updating them. message components really need updated:
<h:form> <p:inputtext id="foo" value="#{bean.foo}" required="true" /> <p:message id="foo_m" for="foo" /> <p:inputtext id="bar" value="#{bean.bar}" required="true" /> <p:message id="bar_m" for="bar" /> <p:commandbutton action="#{bean.action}" update="foo_m bar_m" /> </h:form>
however, gets tedious when have many of them. that's 1 of reasons why primefaces selectors exist. message components have in generated html output common style class of ui-message
, following should do:
<h:form> <p:inputtext id="foo" value="#{bean.foo}" required="true" /> <p:message id="foo_m" for="foo" /> <p:inputtext id="bar" value="#{bean.bar}" required="true" /> <p:message id="bar_m" for="bar" /> <p:commandbutton action="#{bean.action}" update="@(.ui-message)" /> </h:form>
(note should keep ids on message components, otherwise @(...)
won't work! again, see how primefaces selectors in update="@(.myclass)" work? detail)
the @parent
updates parent component, covers current component , siblings , children. more useful if have separated form in sane groups each own responsibility. @this
updates, obviously, current component. normally, necessary when need change 1 of component's own html attributes in action method. e.g.
<p:commandbutton action="#{bean.action}" update="@this" oncomplete="dosomething('#{bean.value}')" />
imagine oncomplete
needs work value
changed in action
, construct wouldn't have worked if component isn't updated, simple reason oncomplete
part of generated html output (and el expressions in there evaluated during render response).
the @all
updates entire document, should used care. normally, you'd use true request instead either plain link (<a>
or <h:link>
) or redirect-after-post ?faces-redirect=true
or externalcontext#redirect()
. in effects, process="@form" update="@all"
has same effect non-ajax (non-partial) submit. in entire jsf career, sensible use case encountered @all
display error page in entirety in case exception occurs during ajax request. see what correct way deal jsf 2.0 exceptions ajaxified components?
the standard jsf equivalent primefaces specific update
render
<f:ajax render>
. behaves same except doesn't support comma-separated string while primefaces 1 (although recommend stick space-separated convention), nor @parent
keyword. both update
, render
defaults @none
(which is, "nothing").
see also:
- how find out client id of component ajax update/render? cannot find component expression "foo" referenced "bar"
- execution order of events when pressing primefaces p:commandbutton
- how decrease request payload of p:ajax during e.g. p:datatable pagination
- how show details of current row p:datatable in p:dialog , update after save
- how use <h:form> in jsf page? single form? multiple forms? nested forms?
Comments
Post a Comment