How to emulated onclick Ajax request from Javascript?

[benjes]

Hi,

I hope someone of you can help me with this.
I have a rich:dataTable which can have multiple pages. The user can navigate between the elements (links) in the table with the keyboard (I am using keypressed for that). In fact the user won't have a mouse so everything has to be controlled by the keyboard. When you press down the focus is moved to the next element, when you press up it is moved to the previous element.

I want to things:

When a link in a table gets the focus it should execute the link (as in onclick)

When the user gets to the last element in a page and presses down the next table page should be shown (as if you would use a rich:datascroller).

So far I simply used the same Javascript calls Ajax4J was creating on the fly for the action event (onclick)

e.g. for starting an AJAX request when getting the focus

<a4j:commandLink ...
 onkeypress="#{stationEntry.keyHandleCommand}"
 onfocus="
 A4J.AJAX.Submit('_viewRoot','#{StationListManager.formID}',this,{'parameters':{'#{stationEntry.componentId}' : '#{stationEntry.componentId}'},'eventsQueue':'foo', 'actionUrl':'/EPG/pages/epg.seam?javax.portlet.faces.DirectLink=true'});
 }"
id="#{StationListManager.entryID}"
action="#{stationsHome.selectStation(stationEntry.station)}"
reRender="NowNext,VideoID">
</a4j:commandLink>

The A4J.AJAX.Submit is the same Ajax4J creates at runtime for the 'action' parameter .

For emulating a rich:datascroller I use

A4J.AJAX.Submit('_viewRoot','SLM_Form0',e,{'ignoreDupResponses':true,'oncomplete':function(request,event,data){setNextFocus()}, 'parameters':{'SLM_Form0:SLMscrollerID':'next'} ,'eventsQueue':'SLM_Form0:SLMscrollerID','actionUrl':'/EPG/pages/epg.seam?javax.portlet.faces.DirectLink=true'} );

in my keypress handler.
This used to work fine with RichFaces 3.1 but now I moved to RichFaces 3.2 and it changed.
Now the datascroller creates Javascript code like:

Event.fire(this, 'rich:datascroller:onscroll', {'page': 'next'});

Does anyone know how I can solve this problem without having to hardcode the javascript code Ajax4J would generate on the fly?
I am fairly new to RichFaces/Seam so every help is welcome.

Thank you

Immo

[ilya_shaikovsky]

a4j:jsFunction designed for this purposes. Usage of our non-publick API isn't a way because its free for changes ;)

[benjes]

Thanks.
I had a look at a4j:jsFunction and it solves my problem to a certain extend.
What I am not sure about is how to pass arguments to the server side function. I know I can use a4j:actionparam and then use the
facesContext.getExternalContext().getRequestParameterMap()
to get the parameters but how could I pass Objects?
Seam makes it possible to call a server side function with an Object as the parameter.
E.g. on the server you've got

@Name("something")
class MyManager {
public void setSomething(MyClass obj){
...
}
}

Now on the client you could have

<rich:dataTable id="#{StationListManager.tableID}" var="entry"
 value="#{something.entryList}" >
 <rich:column id="ColID">
 <a4j:commandLink value="#{entry.name}"
 action="#{something.setSomething(entry)}"
 reRender="someID">
 </a4j:commandLink>
 </rich:column>
</rich:dataTable>

How could I call "#{something.setSomething(entry)} from a a4j:jsFunction?

Thanks

Immo

[ilya_shaikovsky]

but how about f:param or a4j:param for example?

<a4j:jsFunction name="updateStyle" reRender="showname">
 <a4j:actionparam name="param1" assignTo="#{jsFunctionBean.name}" />
 <a4j:actionparam name="param2" assignTo="#{jsFunctionBean.count}" />
 </a4j:jsFunction>
<td onmouseover="updateStyle('#CDEB8B', '16')"
 onmouseout="updateStyle('',14)">Mint, 14px
</td>

for example