3

how can I make a page reload (and the model values updated) by checking/unchecking a selectBooleanCheckbox?

@Ellie: I tried both <a4j:ajax event="click" action="doiListView"/> and <f:ajax event="click" action="doiListView"/>, but nothing happens. The (piece of) code is this:

<td style="font-size: 5pt; border: 0; min-width:60px">
   <rich:calendar id="creationToDate" value="#{listModel.creationDate.rangeEnd}"
                  datePattern="yyyy-MM-dd" enableManualInput="true"
                  rendered="#{listModel.creationDate.range}"
                  valueChangeListener="#{listController.filterFieldChanged}">
   </rich:calendar>
</td>
<td rowspan="2">
   <h:selectBooleanCheckbox value="#{listModel.creationDate.range}">
      <a4j:ajax event="click" action="doiListView"/>
   </h:selectBooleanCheckbox>
</td>

The datepicker should become visible if the checkbox is selected. But with your hint above, nothing happens... If I add onclick="window.location.href=window.location.href" in the selectBooleanCheckbox tag, then it works, but as I said I would like to use RF components if possible...

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
Francesco
  • 2,350
  • 11
  • 36
  • 59

3 Answers3

6

Your question is not very specific. But as far I understand, you basically want to submit the entire form and reload the entire page (why not just the form?).

In that case, you need to set the execute attribute to @form so that the entire form will be submitted (it namely defaults to @this, the current component) and you also need to set the render attribute to @all so that the entire view will be re-rendered (or use @form instead if just re-rendering the form is sufficient).

<h:selectBooleanCheckbox value="#{listModel.creationDate.range}">
    <f:ajax event="click" execute="@form" render="@all" />
</h:selectBooleanCheckbox>

The event="click" is by the way optional in the above construct. It's already the default ajax event for a <h:selectBooleanCheckbox>. You can just leave it away:

<h:selectBooleanCheckbox value="#{listModel.creationDate.range}">
    <f:ajax execute="@form" render="@all" />
</h:selectBooleanCheckbox>

Also, your action attribute is not valid. It does not exist. If you actually want to invoke a method during invoke actions phase, then you need the listener attribute instead.

<h:selectBooleanCheckbox value="#{listModel.creationDate.range}">
    <f:ajax execute="@form" listener="#{listModel.rangeListener}" render="@all" />
</h:selectBooleanCheckbox>

with

public void rangeListener() {
    // ...
}

or, optionally, if you need to be able to broadcast events:

public void rangeListener(AjaxBehaviorEvent event) {
    // ...
}

The syntax is the same for <a4j:ajax>. The only difference is that it resolves execute and render a bit differently and supports more convenient attributes.

See also:

Community
  • 1
  • 1
BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
  • Sorry if I haven't been clear. :) So, I have two calendar input fields, but one becomes visible only when I check the check-box (in the code is 'rendered="#{listModel.creationDate.range}"'). So, what I need is that when I check the box, the page is reloaded so that the range value of the bean is set to true and the calendar input field will appear. Just a simple relaod without submitting anything. (I hope this is more clear ;) ) – Francesco Dec 05 '11 at 08:06
1

You can use a4j:support if your using richfaces or f:ajax of jsf nested inside selectBooleanCheckbox then specify event attribute as onchange or onclick then the action attribute that will be invoke when the event is fired.

Example:

<h:selectBooleanCheckbox value="#{listModel.creationDate.range}">
  <a4j:support event="onclick" action="#{beanName.doThis}" reRender="calendarID"/>
</h:selectBooleanCheckbox>

the event is onclick and the doThis is the method name of the action to be executed on the bean.On your action put the logic to rendered the rich:calendar and don't forget to use the reRender attribute of a4j:support or f:ajax in order for the calendar to be visible

Or you can use the actionListener attribute if you want to check if the value is whether check or unchecked via ActionEvent object.

Or you can use a4j:jsFunction instead if you want to send request via javascript. (for richfaces only)

Although this will fire an ajax request but still will reload a part of the page.

Hope this helps. :)

Vasil Lukach
  • 3,658
  • 3
  • 31
  • 40
Ellie Fabrero
  • 791
  • 2
  • 16
  • 41
  • the event attribute should be onclick not click..try that if it works.And the action attribute should be valid el that points to the method to be executed on the bean. – Ellie Fabrero Dec 03 '11 at 12:50
  • The `` does not exist anymore in RF4. It's replaced by `` which basically extends the JSF2 ``. The `event` attribute should in those tags be the DOM event name, not the HTML attribute name (thus, no `on` prefix). So `` is perfectly valid. – BalusC Dec 03 '11 at 18:32
  • oh i see. I'm still using richfaces 3. :)) – Ellie Fabrero Dec 05 '11 at 02:24
0

From here: http://www.jsftoolbox.com/documentation/help/12-TagReference/html/h_selectBooleanCheckbox.html

The onchange attribute sets the JavaScript code to execute when this element loses focus and its value changes after gaining focus.

You can use the onChange attribute to trigger a form submit with javascript.

So if your jsf tag looks like this:

<h:selectBooleanCheckbox />

you could add the onchange attribte with javascript to get triggered like this:

<h:selectBooleanCheckbox onchange="javascriptFunctionThatSubmitsTheForm();" />

Sblundy was kind enough to answer a similar question here: Seam/JSF form submit firing button onclick event

Community
  • 1
  • 1