Problem using p:ajax with h:selectOneRadio

UI Components for JSF
Post Reply
burferd
Posts: 234
Joined: 01 May 2010, 16:15

06 Sep 2010, 00:21

Using PrimeFaces 2.1, JSF2, NetBeans 6.9.1, Glassfish 3.

I have a composite component that has an h:selectOneRadio component with 2 selectable items (code included below).
The component also contains an h:selectOneMenu, a couple h:outputText components and a p:commandButton.
The h:selectOneRadio component is laid out in page direction, so that the radio buttons are aligned one on top of the other.

When the page is originally displayed, the top radio button is selected and the h:selectOneMenu is enabled.
The intent is that when the bottom radio button is selected, the h:selectOneMenu is disabled and some other components on the page are enabled.
Then when the top radio button is reselected, the h:selectOneMenu is enabled and the other page components are disabled.

I have an action method in the backing bean that is supposed to be called as the action of the p:ajax component for a "change" event.
The backing bean method (code included below) writes a note to the server when called and sets the disabled status flags for the page components.
The update for the p:ajax component is set to "@form" to update the form containing all the components.

Here is what happens:
When the page is initially displayed, the top radio button is selected and the h:selectOneMenu is enabled - this is as expected.
1) Clicking on the bottom radio button will select the radio button, but the action method of the backing bean is not called.
2) Clicking on the bottom radio button again does nothing - it shouldn't since there is no change.
3) Clicking on the top radio button will call the action event in the backing bean - the bottom radio button is still selected and the h:selectOneMenu component is disabled.
4) Clicking on the top radio button again will select the top radio button, the the action method in the backing bean is not called - the h:selectOneMenu is still disabled.
5) Clicking on the bottom radio button will call the action calls the backing bean and the h:selectOneMenu is enabled - the top radio button is still selected.

Basically, it looks like clicking on a radio button will select the radio button, but not call the backing bean action method.
It takes a second click to call the action method in the backing bean.
As a result, you can make the component do what you want it to, but it requires 2 button clicks rather than one.
What is happening here?
This seems like a fairly simple task, but I have no clue what I am doing wrong.

Thanks.

The relevant portion of the composite component:

Code: Select all

            <h:selectOneRadio id="useAddressRB" styleClass="#{cc.attrs.rbStyleClass}"
                              layout="pageDirection"
                              value="#{cc.attrs.rbValue}"
                              disabled="#{cc.attrs.rbDisabled}" >
                <f:selectItems id="useAddressSelectItems"
                               value="#{cc.attrs.rbList}"/>
                <p:ajax action="#{cc.attrs.rbAction}"
                        event="change"
                        update="@form" />
            </h:selectOneRadio>
The complete Composite Component code:

Code: Select all

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:cc="http://java.sun.com/jsf/composite"
      xmlns:p="http://primefaces.prime.com.tr/ui">

    <!-- INTERFACE -->
    <cc:interface>
        <cc:attribute name="styleClass" default="" required="false"/>
        <cc:attribute name="rbStyleClass" default="useAddressRB" required="false"/>
        <cc:attribute name="rbValue" default="" required="false"/>
        <cc:attribute name="rbList" default="" required="false"/>
        <cc:attribute name="rbDisabled" default="false" required="false"/>
        <cc:attribute name="rbAction" method-signature="java.lang.String rbAction()"/>
        <cc:attribute name="rbUpdate" default="" required="false"/>
        <cc:attribute name="text1StyleClass" default="useAddressLbl" required="false"/>
        <cc:attribute name="text1Value" default="Use Address:" required="false"/>
        <cc:attribute name="text2StyleClass" default="newAddressLbl" required="false"/>
        <cc:attribute name="text2Value" default="Add New Address:" required="false"/>
        <cc:attribute name="ddStyleClass" default="useAddressDD" required="false"/>
        <cc:attribute name="ddValue" default="" required="false"/>
        <cc:attribute name="ddDisabled" default="false" required="false"/>
        <cc:attribute name="ddToolTip" default="Select User Address from list." required="false"/>
        <cc:attribute name="ddList" default="" required="false"/>
        <cc:attribute name="ddActionListener" method-signature="java.lang.String ddActionListener()"/>
        <cc:attribute name="ddUpdate" default="" required="false"/>
        <cc:attribute name="mapBtnStyleClass" default="viewMapBtn" required="false"/>
        <cc:attribute name="mapBtnAction" method-signature="java.lang.String mapBtnAction()"/>
        <cc:attribute name="mapBtnDisabled" default="false" required="false"/>
        <cc:attribute name="mapBtnToolTip" default="Push to view location map for selected address." required="false"/>
        <cc:attribute name="mapBtnOnclick" default="mapPopup.show()" required="false"/>
        <cc:attribute name="mapBtnValue" default="View Map" required="false"/>
    </cc:interface>

    <!-- IMPLEMENTATION -->
    <cc:implementation>
        <p:outputPanel id="useAddress" styleClass="#{cc.attrs.styleClass}" >
            <h:selectOneRadio id="useAddressRB" styleClass="#{cc.attrs.rbStyleClass}"
                              layout="pageDirection"
                              value="#{cc.attrs.rbValue}"
                              disabled="#{cc.attrs.rbDisabled}" >
                <f:selectItems id="useAddressSelectItems"
                               value="#{cc.attrs.rbList}"/>
                <p:ajax action="#{cc.attrs.rbAction}"
                        event="change"
                        update="@parent" />
            </h:selectOneRadio>
            <h:outputText id="useAddressLbl" styleClass="#{cc.attrs.text1StyleClass}"
                          value="#{cc.attrs.text1Value}"/>
            <h:selectOneMenu id="useAddressDD" styleClass="#{cc.attrs.ddStyleClass}"
                             disabled="#{cc.attrs.ddDisabled}"
                             title="#{cc.attrs.ddToolTip}"
                             value="#{cc.attrs.ddValue}">
                <f:selectItems id="addressList" value="#{cc.attrs.ddList}"/>
                <p:ajax actionListener="#{cc.attrs.ddActionListener}"
                        event="change"
                        update="#{cc.attrs.ddUpdate}" />
            </h:selectOneMenu>
            <h:outputText id="newAddressLbl" styleClass="#{cc.attrs.text2StyleClass}"
                          value="#{cc.attrs.text2Value}"/>
            <p:commandButton id="viewMapBtn" styleClass="#{cc.attrs.mapBtnStyleClass}"
                             action="#{cc.attrs.mapBtnAction}"
                             disabled="#{cc.attrs.mapBtnDisabled}"
                             title="#{cc.attrs.mapBtnToolTip}"
                             onclick="mapPopup.show();"
                             value="#{cc.attrs.mapBtnValue}"/>
        </p:outputPanel>
    </cc:implementation>
</html>
Code that calls the composite component with the proper references:

Code: Select all

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:comp="http://java.sun.com/jsf/composite/ezcomp"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:cc="http://java.sun.com/jsf/composite"
      xmlns:p="http://primefaces.prime.com.tr/ui">

    <!-- INTERFACE -->
    <cc:interface>
    </cc:interface>

    <!-- IMPLEMENTATION -->
    <cc:implementation>
        <p:outputPanel id="mainPnl" >
            <h:form id="mainForm" styleClass="mainForm" prependId="false" >
                <comp:addressGroup id="useAddressPnl" styleClass="useAddressPnl"
                                   rbDisabled="false"
                                   rbValue="#{sessionBean.addressMode}"
                                   rbList="#{sessionBean.addressModeList}"
                                   rbAction="#{sessionBean.useAddressRB_action}"
                                   rbUpdate="@form"
                                   ddDisabled="#{sessionBean.disableAddressDD}"
                                   ddValue="#{sessionBean.selectedAddress}"
                                   ddList="#{sessionBean.addressList}"
                                   ddActionListener="#{sessionBean.useAddressDD_actionEvent}"
                                   ddUpdate="@form"
                                   mapBtnAction="#{enrollSessionBean.viewMapBtn_action}"
                                   mapBtnDisabled="false"
                                   mapBtnOnclick="" />
            </h:form>
        </p:outputPanel>
    </cc:implementation>
</html>
Action method in the backing bean

Code: Select all

    public void useAddressRB_action() {
        String s = getAddressMode();
        boolean b = false;
        if( s.equals("0"))  // From List
        {
            b = true;
        }
        System.out.println("<SessionBean.useAddressRB_action> Current AddressMode = "+s+", setting disableAddress to "+b);
        setDisableAddress( b );
        setDisableAddressDD( !b );
    }
Using PrimeFaces 3.4, Mojarra 2.1.6, Glassfish 3.1.2, NetBerans 7.2, Hibernate 3.2.5 (sometimes)
Windows 7.

lobz
Posts: 21
Joined: 17 Nov 2010, 13:49
Location: Hungary

17 Nov 2010, 14:43

You did not mention the browser. If it's IE than there is a bug related to the onchange event of the radio button:

http://webbugtrack.blogspot.com/2007/11 ... perly.html

Post Reply

Return to “PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 46 guests