When I am trying to insert a validator to a selectOneMenu element containing a ajax listener in JSF, the ajax listener begins to not working. The following is my JSF snipplet specific to issue I am talking:
<h:selectOneMenu id="metalCodes" converter="metalCodeConverter" required="true" requiredMessage="#{lang.metalStockIntroducing_metalCode_req_txt}" value="#{metalStockIntroducingProcessesBean.metal.metalCode}">
<f:selectItem itemLabel="Please select..." noSelectionOption="true" />
<f:selectItems value="#{metalStockIntroducingProcessesBean.metalCodesMenu}" />
<f:ajax listener="#{metalStockIntroducingProcessesBean.changeMetalType}" event="change" execute="metalCodes" render="metalTypesMenu" immediate="false"/>
<f:validator validatorId="densityValidator"/>
</h:selectOneMenu>
What would you friends recommend me to do in order to make the validator and ajax listener works collaborately in a h:selectOneMenu JSF element?
They ought to work fine together. The ajax listener method will only not be invoked when the validator threw an exception. Make sure that your validator isn't incorrectly doing that. Make sure that you're re-rendering the <h:message> or <h:messages> associated with the input component as well so that you get notified of any faces messages during an ajax request. Or at least read the server logs, any queued-but-not-displayed faces messages will be logged there.
Related
I want to implement a live filter for a list with JSF 2 but when using keyup event so many requests are being sent to the server. The code looks like:
<h:inputText id="filter_input" value="#{bean.filterText}">
<f:ajax event="keyup" listener="#{bean.filter}"
render="#form:list" execute="#this" />
</h:inputText>
f:ajax has added support for ajax event delay starting from JSF 2.2. Just include it as an attribute with its value in miliseconds:
<f:ajax event="keyup" delay="1000" listener="#{someBean.doSomething}"
render="somefield" execute="#this" />
See also:
Primefaces keyup event delay
Richfaces a4j event queuing
Delay a JSF AJAX listener for checkbox group
JSF 2.1 Ajax autocomplete + server search only after user stops typing
If you are using a previous version of JSF, PrimeFaces has been supporting a similar feature before JSF did:
<p:ajax event="keyup" delay="1000" listener="#{bean.filter}"
update="somefield" process="#this" />
Note that PrimeFace does not use a render attribute nor does it use execute. Use update and process instead (although process="#this" is redundant beacuse it's already the default value for p:ajax)
here's the documentation :
https://www.primefaces.org/docs/vdl/5.0/core/primefaces-p/ajax.html
And an other post that is related : primefaces keyup event delay
Can i use immediate property in JSF to refresh my html page without calling any backing bean methods?? i am new to jsf please suggest & also explain use of immediate
Imagine that you have this code:
<h:form>
<h:selectOneMenu id="subscriptions"
value="#{subscriptionController.subscriptions}"
immediate="true">
<f:selectItem id="item1" itemLabel="News" itemValue="1" />
<f:selectItem id="item2" itemLabel="Sports" itemValue="2" />
<f:selectItem id="item3" itemLabel="Music" itemValue="3" />
<f:selectItem id="item4" itemLabel="Java" itemValue="4" />
<f:selectItem id="item5" itemLabel="Web" itemValue="5" />
</h:selectOneMenu>
</h:form>
Regarding the immediate attribute is a boolean flag indicating that component events should be sent to registered event listeners immediately rather than after the validation phase of the JSF request processing lifecycle. The immediate flag allows you bypass JSF validation for a particular component. Reference here.
JSF life cycle is not easy to understand but you can check a good explanation here: JSF Life cycle
At a next level of experience you can add ajax to improve even more your performance. And the most recommended is to use libraries in that case, for example RichFaces and PrimeFaces.
Regards,
According to your requirement it seems that you don't need to use immediate attribute.
Just use f:ajax to process(execute) and update(render) particular elements or group of elements. It will not harm the performance.
And to know JSF Lifecycle and detail of immediate attribute please check Baluc's Blog
Use reRender attribute by using richfaces components for refresh the page or particular region of a page.
I have a <p:dialog> which contains a <h:selectOneMenu> with a valueChangeListener. Here's the relevant code:
<p:dialog>
<h:form>
<div>
<h:selectOneMenu value="#{itemController.itemId}" valueChangeListener="#{itemController.chkItemType}" onchange="submit()">
<f:selectItems value="#{itemController.itemsList}" />
</h:selectOneMenu>
</div>
</h:form>
</p:dialog>
When it is called, the dialog get closed. I would like to keep it open and only close it on cancel button. How can I achieve this?
That's expected behaviour. The onchange="submit()" which you've there submits the entire form synchronously, causing a complete page reload.
You should be using ajax instead to perform the submit. Replace the onchange attribute by just this tag
<f:ajax />
inside the <h:selectOneMenu>. This way the form will be submitted asynchronously, with by default no page reload at all.
Depending on the concrete functional requirement, which you didn't tell anything about, you do probably also not need a valueChangeListener at all, but rather a <f:ajax listener>.
<f:ajax listener="#{itemController.chkItemType}" />
If you'd like to update some parts of the page on successful execution of the ajax request, use its render attribute.
See also:
When to use valueChangeListener or f:ajax listener?
i got this error in my console.and suddenly the selectOneMenu did not fire any listener when the value changes.im using primefaces-3.0.M2.jar.
Unhandled by MetaTagHandler for type org.primefaces.component.behavior.ajax.AjaxBehavior
and this is my code in .xhtml file
<p:ajax actionListener="#{innovationManager.innovationAreaListener}" event="change" update="frmInnovation" />
anyone got any clue about this?
The <p:ajax> tag does not support the actionListener attribute. It should have been listener.
<p:ajax listener="#{innovationManager.innovationAreaListener}" event="change" update="frmInnovation" />
I wonder if you didn't omit some parts of the error message. The hint about the actionListener attribute should have been included in the exception message.
So, let me show us my troubles :)
1 - When i click on a commandbutton
<h:commandButton value="Somethings">
<f:setPropertyActionListener target="#{bean.method}" value="some" />
<f:ajax render="rendering"/>
</h:commandButton>
I dont do any action to the commandButton. Just i fire the ajax call. If i add an action on the button (like action="bean.myAction) it will be executedat the 5° phase of the JSF lifecycle (allright, only if i write event="action" in the f:ajax, but thats as default). Right? But the f:ajax is fired by cliccing on the button as default? Because for a ListBox for example, it's fired only if i write event="change" (the same, i shouldnt write it, because is as default).
2 - When i click on image
<h:graphicImage value="img/img.png" alt="img">
<f:setPropertyActionListener target="#{bean.method}" value="some" />
<f:ajax event="onclick" render="rendering"/>
</h:graphicImage>
This doesnt work. Why?
As usual, thanks for the help!!!!
1 - When i click on a commandbutton
I dont do any action to the commandButton. Just i fire the ajax call. If i add an action on the button (like action="bean.myAction) it will be executedat the 5° phase of the JSF lifecycle
The f:setPropertyActionListener will be executed in the 5th phase as well.
(allright, only if i write event="action" in the f:ajax, but thats as default). Right? But the f:ajax is fired by cliccing on the button as default? Because for a ListBox for example, it's fired only if i write event="change" (the same, i shouldnt write it, because is as default).
The f:ajax just changes the behaviour from a synchronous submit to asynchronous (partial) submit. It does that by generating some additional JavaScript code to the desired event attribute of the parent component (e.g. onclick, onchange, etc, look in generated HTML output in webbrowser). It doesn't change anything in the JSF lifecycle. Only the rendered response will be a partial response which is exactly the part which is to be updated in the component(s) with ID as definied in render attribute.
2 - When i click on image
This doesnt work. Why?
Because the h:graphicImage does not support f:setPropertyActionListener at all. It only works in UICommand components.
You want to wrap it in a h:commandLink instead.
<h:commandLink>
<f:setPropertyActionListener target="#{bean.method}" value="some" />
<f:ajax event="action" render="rendering"/>
<h:graphicImage value="img/img.png" alt="img"/>
</h:commandLink>
(and if necessary style the border/underline caused by generated <a> element away with CSS)