25

The wrong codes are:

<h:form id="search_form">
<h:commandButton class="button" value="View" action="#{InfoBean.search}">
    <f:ajax execute="search_form" render="linear1"></f:ajax>
    <f:ajax execute="search_form" render="linear2"></f:ajax>
</h:commandButton>
<p:lineChart id="linear1" value="#{InfoBean.linearModel1}" legendPosition="e"/>
<p:lineChart id="linear2" value="#{InfoBean.linearModel2}" legendPosition="e"/>
</h:form>

What I want to do is when I click on the commandButton, I want to refresh those two charts. But now I used two <ajax> tags, of which the second doesn't work.

So how can I use ajax to render two charts?

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
Cacheing
  • 3,431
  • 20
  • 46
  • 65

2 Answers2

56

You can render multiple components with single f:ajax. Just make sure all individual components you want to update have an id. In your sample it would be something like:

<f:ajax execute="search_form" render="linear1 linear2"/>

Where the IDs need to be separated by just whitespace like linear1 linear2 and not commaseparated like linear1, linear2 (that works only in p:ajax).

See also:

Community
  • 1
  • 1
partlov
  • 13,789
  • 6
  • 63
  • 82
  • I wonder if there is a solution to render multiple dynamic components which will be created during run time – electricalbah Aug 23 '15 at 01:53
  • @electricalbah f:ajax reloads the elements from server. if by "runtime" you mean created via JS independent from the server then it's not possible to update them like this. – Hubert Grzeskowiak Apr 04 '16 at 15:22
0

For a4j jsf use ',': <a4j:support event="onchange" reRender="parent,child1,child2" />

Chinmoy
  • 1,391
  • 13
  • 14