JSF action from onChange

I am trying to set up a data table with JSF in which there are fields for the total amount of rows that sum the total amount of rows by changing any field in the row. the line looks like this:

<tr id="input_row_1">
<td id="mondayInput1">
    <h:inputText id="monday1" size="4" value="#{timesheet.monday1}" required="false" />
    <!-- <input name="monday1" class="smallInput" type="number" size="2" maxlength="4" min="0"/> -->
</td>
<td id="tuesdayInput1">
    <h:inputText id="tuesday1" size="4" value="#{timesheet.tuesday1}" required="false" />
    <!--<input name="tuesday1" class="smallInput" type="number" size="2" maxlength="4" min="0"/> -->
</td>
<td id="wednesdayInput1">
    <h:inputText id="wednesday1" size="4" value="#{timesheet.wednesday1}" required="false" />
    <!--<input name="wednesday1" class="smallInput" type="number" size="2" maxlength="4" min="0"/> -->
</td>
<td id="thursdayInput1">
    <h:inputText id="thursday1" size="4" value="#{timesheet.thursday1}" required="false" />
    <!--<input name="thursday1" class="smallInput" type="number" size="2" maxlength="4" min="0"/> -->
</td>
<td id="fridayInput1">
    <h:inputText id="friday1" size="4" value="#{timesheet.friday1}" required="false" />
    <!--<input name="friday1" class="smallInput" type="number" size="2" maxlength="4" min="0"/> -->
</td>
<td id="saturdayInput1">
    <h:inputText id="saturday1" size="4" value="#{timesheet.saturday1}" required="false" />
    <!--<input name="saturday1" class="smallInput" type="number" size="2" maxlength="4" min="0"/> -->
</td>
<td id="sundayInput1">
    <h:inputText id="sunday1" size="4" value="#{timesheet.sunday1}" required="false" />
    <!--<input name="sunday1" class="smallInput" type="number" size="2" maxlength="4" min="0"/> -->
</td>
<td>
    <h:inputText id="total1" size="4" value="#{timesheet.total1}" required="false" />
    <!-- <input name="total1" id="total1" type="text" size="5" readonly="readonly" /> -->
</td>

so I first tried adding onChange="#{timesheet.setTotal1}"to the entries of the day, but the onChange event fires javascript, not java / JSF code. Can someone help get the total number of updates?

EDIT: I accepted BalusC's answer, but also had to include the attribute eventin the tag <f:ajax>in order to make it work, e.g.

<h:inputText id="friday1" size="4" value="#{timesheet.friday1}" maxlength="4" required="false" >
    <f:ajax event="change" render="total1" listener="#{timesheet.updateTotal1}" />
</h:inputText>
+5
source share
1 answer

, onchange HTML , JavaScript onchange. "plain vanilla" HTML. EL- . . .

, JSF 2.x(, JSF impl/version , JSF 2.x - -, JSF 1.x). , JSF 2.0 <f:ajax> .

<h:inputText ...>
    <f:ajax listener="#{timesheet.changeTotal1}" render="idOfTotalComponent" />
</h:inputText>

...

<h:outputText id="idOfTotalComponent" value="#{timesheet.total1}" />

public void changeTotal1(AjaxBehaviorEvent event) {
    total1 = ...;
}
+6

All Articles