Button pressed -> Javascript -> EJB3 -> Facelets (reRender)

[rcherchi]

Hi guys,

I'm trying to do the following thing with Seam, AJAX and Google Maps :

1. The user press a button
2. A Javascript function is called and gets data from a third party API (Google Maps)
3. A Session bean's method is called (using seam remoting and query the database.

myEJBMethod(param1, param2, param3, param4)

4. In Java, a result List is initialized and outjected


<< So far everything is fine (I get a callback in Javascript). >>

But what I would like to do next is :

5. dynamically refresh the result list (I use facelets as a view)

<ui:repeat value="#{myResults}" var="res">
#{res.name}
</ui:repeat>

6. Display markers on the map (Javascript) - that should be ok because I get the JS callback.


I guess Ajax4jsf would be the solution but I don't know exactly how I should use it to do the job.

Thanks a lot for your help.

[sergeysmirnov]

Just use a4j:jsFunction

[rcherchi]

Thanks Sergey,

I guess I'm close to the point...

When I get the Javascript Callback, I call the a4j:jsFunction implemented like this at the moment :

<a4j:jsFunction name="me" reRender="myResults"
 oncomplete="justForTesting()" />

<a4j:repeat value="#{myResults}" var="res">
 <div>....</div>
</a4j:repeat>

On the application side, I have the following attribute initialized and outjected have the remote method gets executed:

 @Out
 List myResults;

Do you know why the result list doesn't rerender yet ?

NB:
* The JS function justForTesting() got called succesfully.
* My result list appears the next time I reload the page.

I guess only the rerendering is wrong at this time.

I also changed the

ui:repeat

to

a4j:repeat

but I don't know if it's necessary.

I red this documentation to help me out http://labs.jboss.com/jbossajax4jsf/docs/devguide/en/html/AjaxComponentsLibrary.html#jsFunction and I don't really understand what this mean :

rerender Id['s] (in format of call UIComponent.findComponent()) of components

Thanks again.

[rcherchi]

Solved :)

<h:form id="my-result-list">
 <a4j:jsFunction name="refreshResultList" reRender="result-list" />
 <ui:repeat value="#{myResults}" var="poi">
 <div>...</div>
 </ui:repeat>
 </h:form>

Please, let me know if there is a nicer way to do it.

Regards

[sergeysmirnov]

<h:form>
 <a4j:jsFunction name="refreshResultList" reRender="resultLst" />
 </h:form>
<ui:repeat id="resultLst" value="#{myResults}" var="poi">
 <div>...</div>
</ui:repeat>