Some background: I am building a custom JSF component. The component is basically a text editor and it should have a \"Save\" -button for saving the content string of the ed
I did this task several times. Yo don't need multiply hidden fiels. You can use only one hidden field, convert all input values to JSON object via JSON.stringify and set into this field. On the server side - deserialize JSON object (there are many Java libs for that) to an Java class. That's all.
I couldn't find out how to call beans direcly with javascript, but here is a hack around calling f:ajax-declaration from javascript:
1) Create a hidden form with fields for all the data that you want to send to the server. Include a h:commandButton as well:
<h:form id="hiddenForm" style="display: none;">
<h:inputHidden id="someData" value="#{someBean.someData}" />
<h:commandButton id="invisibleClickTarget">
<f:ajax execute="@form" listener="#{someBean.myCoolActionOnServer()}" />
</h:commandButton>
</h:form>
As usual, listener
attribute, #{someBean.myCoolActionOnServer()}
in this case, refers to the method that you want to execute on the server.
2) In some other button use onclick
to call for your special javascript AND click the trigger-button via javascript:
<h:commandButton value="Click me" onclick="populateTheForm('hiddenForm'); document.getElementById('hiddenForm:invisibleClickTarget').click(); return false;" />
populateTheForm()
should actually fill the data into hiddenForm's fields.
This is a simplification of my case but should work. Still looking for more conventient approach, though.