How to ajax render only the inputs instead of the whole form?

Question

I have a form in JSF 2.0 with a lot of text (labels) and checkboxes. The text never get updated upon submit, but the checkbox values does.

For example:

<h:form>

  <h:outputLabel value="bla bla bla bla .. X 1000" id="lab1">
  <h:selectBooleanCheckbox for="lab1">

  <h:outputLabel value="bla bla bla bla .. X 1000" id="lab2">
  <h:selectBooleanCheckbox for="lab2">

  .... many more labels and checkboxes ...

  <h:commandButton>
      <f:ajax render="@form" execute="@form" />
  </h:commandButton>     

</h:form>

The problem is that whenever I do a submit, the whole form content is been re-rendered. I would like just the checkbox values to be re-rendered. This could save 90% of the request size.

Is there a good solution for this problem?

Answer 1

The render attribute accepts a space separated string of multiple component IDs. You could specify the component IDs of the desired inputs in the render attribute instead of the whole @form.

Your view markup is invalid (look like you confused label for with input id), but to the point it should look like this:

<h:outputLabel value="bla bla bla bla .. X 1000" for="lab1">
<h:selectBooleanCheckbox id="lab1">

<h:outputLabel value="bla bla bla bla .. X 1000" for="lab2">
<h:selectBooleanCheckbox id="lab2">

.... many more labels and checkboxes ...

<h:commandButton>
    <f:ajax execute="@form" render="lab1 lab2 lab3 lab4 ..." />
</h:commandButton>     

Note that it accepts an EL expression as well. If this is a dynamically generated form and/or the ID and number of checkboxes are known beforehand in the bean, then you should be able to use something like:

    <f:ajax execute="@form" render="#{bean.allCheckboxIds}" />