Search code examples
jsfjsf-2richfacesajax4jsftomahawk

t:selectOneRadio with a4j:ajax no javascript rendered


I'm creating a dynamic form with radio buttons in front of each rows that need to update a cart when a different row is selected :

<t:inputText id="test">
    <f:ajax event="click" onevent="alert('3');" />
</t:inputText>

<t:selectOneRadio id="rbtnQuantity" value="#{orderActions.selectedQuantity}" layout="spread">
    <f:selectItems value="#{orderActions.quantities}" var="item" />
    <f:converter converterId="integerConverter" />
    <a4j:ajax event="click" oncomplete="renderPrices();" />
</t:selectOneRadio>

<rich:dataTable id="tblQuantities" styleClass="quantities" value="#{orderActions.formatQuantityPrices}" var="item" rowKeyVar="row">
    <h:column>
        <t:radio id="rbtnQuantity" for=":form:rbtnQuantity" index="#{row}" />
    </h:column>

    <h:column>
        <h:outputText value="#{item.quantity}" />
    </h:column>

    <h:column>
        <h:outputText value="#{item.price}">
            <f:convertNumber type="currency" currencySymbol="$" />
        </h:outputText>
    </h:column>

    <h:column>
        <h:outputText value="#{item.price / item.quantity}">
            <f:convertNumber type="currency" currencySymbol="$" />
        </h:outputText>/u
    </h:column>
</rich:dataTable>

The problem is that no radio button fire the ajax event, even no javascript code is rendered in the resuling code :

<table id="form:tblQuantities" class="rf-dt quantities">
    <colgroup span="4">
    </colgroup>
    <tbody id="form:tblQuantities:tb" class="rf-dt-b">
        <tr id="form:tblQuantities:0" class="rf-dt-r rf-dt-fst-r">
            <td id="form:tblQuantities:0:j_idt296" class="rf-dt-c">
                <label><input id="form:tblQuantities:0:rbtnQuantity" type="radio" name="form:rbtnQuantity" checked="checked" value="25" />&#160;25</label>
            </td>
            <td id="form:tblQuantities:0:j_idt297" class="rf-dt-c">25</td>
            <td id="form:tblQuantities:0:j_idt309" class="rf-dt-c">118,75 $</td>
            <td id="form:tblQuantities:0:j_idt310" class="rf-dt-c">4,75 $/u</td>
        </tr>
[more similar rows...]

I've also included one t:inputText at top, see if it was the t:selectOneRadio usage that was the problem but no.

I'm using Mojarra, RichFaces 4.2.1, Tomahawk 1.1.14.


Solution

  • Since I've not been able to use a4j:ajax or f:ajax with t:selectOneRadio, I've used this workaround :

    <a4j:jsFunction name="changeQuantity" oncomplete="renderPrices();">
        <a4j:param assignTo="#{orderActions.selectedQuantity}" name="quantity" />
    </a4j:jsFunction>
    
    <t:selectOneRadio onclick="quantity = jQuery(this).val();changeQuantity(quantity);" id="rbtnQuantity" value="#{orderActions.selectedQuantity}" layout="spread">
        <f:selectItems value="#{orderActions.quantities}" var="item" />
        <f:converter converterId="integerConverter" />
    </t:selectOneRadio>
    

    It is working properly, but I would prefer to fix the problem if ever someone find the right solution or I.

    EDIT :

    Here is the final used code :

    <a4j:jsFunction name="changeQuantity" oncomplete="renderPrices();">
        <a4j:param assignTo="#{orderActions.selectedQuantity}" name="quantity" />
    </a4j:jsFunction>
    
    # Each row of the table :
    
    <input type="radio" name="quantity" value="#{item.quantity}" checked="#{orderActions.selectedQuantity eq item.quantity ? 'checked' : ''}" onclick="changeQuantity(#{item.quantity});" />