In my development task, I want to use #{rich.component('some_comp_Id')} in my javascript code, but it's impossible to let js recognize it.

So, I found a way to use a4j:jsFunction to do the proxy.

Suppose we have a js method named showModalById, but now we want to create a method named showModalByComponent.

function showModalById(id){

     ...

}

function showModalByComponent(component){

     //we cannot use #{rich...} here, if the parameter is Id

     ...

}

The New World is:

<a4j:jsFunction name="showModalById" oncomplete="showModalByComponent(#{rich:component(flash.window)});">

     <a4j:param name="some_comp_Id" assignTo="#{flash.window}"/>

</a4j:jsFunction>

Note:

The flash is the page cache which is JSF2 new feature. And the window is a random name, you can define it whatever.

Then the old showModalById is no used, and you can invoke the method like this way:

<... onclick(showModalById('treeId'))/>

The showModalByComponent will be a background method.

Good Luck!