JSF 2.0 : Multiple ajax responses for a request - ajax

I will be having a data table where multiple selections (check boxes) can be done. I should fire a single AJAX request in return I should be able to update the status of each selection (rows) in multiple AJAX responses.
How can I achieve this in JSF 2.0? I have reviewed PrimeFaces, ICEFaces and RichFaces, but I couldn't come to a conclusion of which one to use to accomplish this requirement.
I'm new JSF 2.0, any help will be appreciated.

If you know ids of all the fields need to be update then this can be done like this
List<String> renderList = (List<String>)
FacesContext.getCurrentInstance().getPartialViewContext().getRenderIds();
renderList.add(clientId1);
renderList.add(clientId2);
renderList.add(clientId3);
renderList.add(clientId4);
here client id is compbination of id and form id eg:
<h:form id="myBean">
<h:inputText id="textBox" />
</h:form>
then client id will be : myBean:textBox
then all the fields you are adding in re-renderlist will be rerender in single ajax request

Related

Spring Boot Data JPA tables with search, pagination and sorting

I'm developing an adminstration interface for a set of tables. I need to implement functionalities such as listing, sorting, filtering and pagination.
I'm using Spring Boot as a starter and Spring Data Jpa for repository. I've searched the Web for some examples about a complete solution that includes all the above functionalities. What I found included almost all of them, but appearently if there was pagination and sorting there wasn't filtering or viceversa.
Now I'm storing the filter in a application object on session using #ModelAttribute but I know that is now a good design because the applciation will extend and it becomes hard to maintain. I'm also using Page and Pagination for pagination purpose and using Specifications for filtering.
What I want is to submit all the data, i.e.: search fields, sorted fields and current page, in a single request. Off course if the search fields are not empty the pagination will be reinitialize.
Another thing is that I don't want to use jQuery datatables but plain HTML and form submission.
Here are some tutorials and examples that I found:
Link 1
Link 2
Thanks in advance
EDIT html form included
Here is the structure of my table and my pagination section:
<form method=post action=someLink>
<table> -populated from controller using Thymeleaf - </table>
<div class=pagination>
<ul> - actually this div is build using the page object returned from server -
<li><a href=link/?page=;size=;>1</a></li>
<li><a href=link/?page=;size=;>2</a></li>
<li><a href=link/?page=;size=;>3</a></li>
</ul>
</div>
</form>
As you can see the form is separated from my pagination div. When I click on a page number a get request is send to the server and executes the query with the stored filter. When I submit the form the page number is not taken into consideration because the number of pages can change.
So my question is how to build the form to include the pagination in one single submit.
I'm thinking instead of using a's to use input elements so on the server I can read the data from them. I don't know how to submit that post request with the pageable attributes.
Thanks
The first thing that you have to do is to enable Spring Data web support. If you are using Spring Boot, it's probably activated by Spring Boot.
After you have enabled the Spring Data web support, you can specify the current page, page size, and sorting options by settings the values of these request parameters:
The value of the page request parameter identifies the current page (this is zero indexed).
The value of the size request parameter defines the page size. The default page size is 20.
The value of the sort request parameter defines the sort options.
Spring Data JPA reference manual provides more information about the supported syntax.
You can now "inject" the requested page information into your controller method by adding a new org.springframework.data.domain.Pageable method parameter into your controller method. In your case, the controller method could look as follows:
#RequestMapping(value = "/search", method=RequestMethod.POST)
public String search(#ModelAttribute("searchFilter") FilterDTO filter, Pageable page) {
//Add logic here
return "results";
}

Apache-Shiro: User authenticates within AJAX, how to restore GET-Variables after login?

in my JavaEE-Application, I am using Apache Shiro[1] for user-authentication.
My users are navigating via GET-URLs, as for example "/company/index.xhtml?companyId=327".
I have enabled programmatic login, following a guide[2] from BalusC:
SavedRequest savedRequest = WebUtils.getAndClearSavedRequest(Faces.getRequest());
My problem is, that savedRequest.getRequestUrl() does not contain the previous mentioned GET-parameteres, when my case is asynchronous POST with or without RememberMe; just "/company/index.xhtml" is returned, for example. It seems as if "FacesAjaxAwareUserFilter" (see [2]) is not GET-params aware. Everything works fine on synchronous GET-calls.
How do I get the GET-parameters after an shiro-redirect because of authentication-needed in case of using "FacesAjaxAwareUserFilter"?
[1] https://shiro.apache.org/
[2] Followed this great article about JavaEE and Shiro: http://balusc.blogspot.de/2013/01/apache-shiro-is-it-ready-for-java-ee-6.html
JSF ajax requests are sent to the URL as generated by <h:form>. This is however by default not exactly the current URL including the query string, it's by default the current URI without the query string.
There are several ways to fix this. The simplest but ugliest way is to use JS:
<h:form id="foo">
...
</h:form>
<script>document.getElementById("foo").action += "?" + location.search;</script>
The cleanest way would be to create a custom ViewHandler whose getActionURL() (as used by <h:form>) will return the desired URL with the query string.
JSF utility library OmniFaces has already such a component which does that based on view parameters: the <o:form> which basically extends the <h:form> with support for includeViewParams="true" (exactly the same way as <h:link> does).
<f:metadata>
<f:viewParam name="companyId" value="#{bean.company}" />
</f:metadata>
...
<o:form includeViewParams="true">
...
</o:form>

Primefaces p:calendar with p:ajax value not updated (one step delay)

I want to call a bean after a date is selected in a p:calendar. In my setup I have a #Named #ViewScoped Bean, the class ObWithDate is a #Entity with a date field validFrom.
<h:form id="fUser">
<p:dataTable id="dt" var="cum" value="#{myBean.listObWithDates}">
<p:column>
<p:calendar id="cValidFrom" value="#{cum.validFrom}">
<p:ajax event="dateSelect" listener="#{myBean.update(cum)}"
update=":fUser:dt"/>
</p:calendar>
</p:column>
</p:dataTable>
</h:form>
The good thing is, that the bean method update(ObWithDate myO) is called with the correct object each time I select a date. The bad thing is, that myO.validFrom does not have the correct value. It's always one step behind:
Field initialized with 2012-01-01
GUI change to 2012-01-05, bean method debugs to 2012-01-01
GUI change to 2012-01-15, bean method debugs to 2012-01-05
This issue drives me crazy, I've found several issues with not correctly updated values and also some about p:calendar. Most of them suggest using the attribute selectListener="#{calendarBean.handleDateSelect}" with a handleDateSelect(DateSelectEvent event) method. But I want to call my method since I want to pass the current instance of the variable.
Firebug verifies, that the correct updated values are transmitted in a POST request
I'm using Primefaces 3.2 and JBoss-7.1.1-Final
Even without the p:dataTable and only using p:calendar the issue is still the same.
The wrong value of the debug output can be observed for the method-Object update(ObWithDate myO) as well for the corresponding entry in myBean.listObWithDates.
<p:ajax immediate="true" .../> does not solve this issue.
Update MattHandy helped me a lot, the resulting question How to get the corresponding list item in the ajax call inside the beans method? is formulated in the followup JSF p:calendar in p:dataTable: How to get the row of p:ajax dateSelect event.
This is most likely a lifecycle issue. The setter for your field is called before your listener executes. You should not use the listener to set your value.
The el expression on your listener is evaluated at render response phase of the previous request thus it holds the cum value "one step behind".
You should update your custom object from the setter of the calendar's date value.
I ran into this issue today morning. Found that primefaces have removed the DateSelectEvent from Primefaces 3.5 . Hence had to remove the ajax event call from my calendar object. Instead retrieving the value using get..(). Please find the discussion for the same in this link below.
http://forum.primefaces.org/viewtopic.php?f=3&t=27590

How to know whether JSF bean setter is invoked from AJAX event or as part of form POST processing

I have a form that contains a Part Number inputText field and some other fields that represent the attributes of a part. If the user enters an existing part number, I want to populate the other fields with the part's existing attributes. The operator then has the option to change Part Number to something else (essentially creating a new part using the existing part as a template) and/or modify its attributes. I have an AJAX event defined to update the model when Part Number changes, so I can retrieve the attributes from the database:
<f:ajax event="valueChange" execute="#this" render="partlength" />
My question is this: How does the Part Number setter (e.g. setPartNumber() ) know whether it is being invoked as part of an AJAX event, in which case I want to fetch the attributes, or as part of the Update Model Values phase of the form being posted, in which case I don't? Or is there a better way to accomplish what I'm trying to do?
You can determine by PartialViewContext#isAjaxRequest() whether the current request is an ajax request or not. You can obtain the PartialViewContext by FacesContext#getPartialViewContext().
if (FacesContext.getCurrentInstance().getPartialViewContext().isAjaxRequest()) {
// The current request is an ajax request.
}
An alternative is to just do the job in the listener method of <f:ajax> instead of in the getter/setter (doing business job in getters/setters is a poor practice anyway):
<f:ajax listener="#{bean.listener}" render="partlength" />
(note that I omitted the event and execute attributes as you've used the default values already)

what is data.foo syntax in JSF/Rich Faces

what is data.foo syntax in JSF/Rich Faces?
Say for example,
<a4j:support event="onchange" action="#{bean.retrieveStates}"
reRender="states_dropDown" data="#{student}"></a4j:support>
i am passing student object in data attribute. can I access in managed bean?
Documentation says this
"Serialized (on default with JSON) data passed on the client by a developer on AJAX request. It's accessible via "data.foo" syntax "
can some one please explain.
From this blogpost:
Another attribute is data, which allows you to get any additional data from
the server during an Ajax request. The data attribute can simply point to a
bean property via EL, and the data will be serialized in JSON format and
available on the client side. Here’s an example:
<a4j:commandButton value="Submit" reRender="out"
data="#{bean.text}"
oncomplete="alert(data)"/>
So yes - you can access any attribute of the managed bean and reference it (most often) in oncomplete.

Resources