11 Replies Latest reply on Dec 2, 2011 1:46 PM by Thorsten Nieser

    a4j:ajax and multiple h:selectOneRadio elements

    Thorsten Nieser Newbie

      Hi all,

       

      I use several h:selectOneRadio buttons to build a more user friendly selection interface, something like this

      layout.gif

       

      Selection and rerender works fine until I start an ajax call with a commandLink element. The linkElement starts the persistence process to dbin my case.

      To avoid problems with logic steps behind I created a simple sample attached below. But same behaviour again.

      After debugging the process I figure out that if link is clicked the setter of the pos property is called with value 0. Only exception: The last element is selected.

       

      XHTML file

       

      <!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:ui="http://java.sun.com/jsf/facelets"

          xmlns:a4j="http://richfaces.org/a4j"

          xmlns:rich="http://richfaces.org/rich">

       

      <f:view contentType="text/html">

          <h:head>

          </h:head>

          <h:body>

              <h:form>   

             

                  <rich:panel id="headerPanel">

                      <rich:tabPanel switchType="client">

                          <rich:tab header="Header">

                              <rich:panel>       

       

                                  <h:selectOneRadio value="#{bean.pos}">

                                      <f:selectItem itemValue="0" itemLabel="Top left" />

                                      <a4j:ajax event="click" render="headerPanel" />

                                  </h:selectOneRadio>

                                 

                                  <h:selectOneRadio value="#{bean.pos}">

                                      <f:selectItem itemValue="1" itemLabel="Top right" />

                                      <a4j:ajax event="click" render="headerPanel" />

                                  </h:selectOneRadio>

                                 

                                  <h:selectOneRadio value="#{bean.pos}">

                                      <f:selectItem itemValue="2" itemLabel="Center" />

                                      <a4j:ajax event="click" render="headerPanel" />

                                  </h:selectOneRadio>

                                 

                                  <h:selectOneRadio value="#{bean.pos}">

                                      <f:selectItem itemValue="3" itemLabel="Bottom left" />

                                      <a4j:ajax event="click" render="headerPanel" />

                                  </h:selectOneRadio>

                                 

                                  <h:selectOneRadio value="#{bean.pos}">

                                      <f:selectItem itemValue="4" itemLabel="Bottom right" />

                                      <a4j:ajax event="click"    render="headerPanel" />

                                  </h:selectOneRadio>

                                 

                              </rich:panel>       

                          </rich:tab>

                      </rich:tabPanel>

                  </rich:panel>

                 

                  <a4j:commandLink value="start ajax event" render="headerPanel" execute="headerPanel"/>

                 

              </h:form>

          </h:body>

      </f:view>

      </html>

       

      JAVA Bean

       

      import java.io.Serializable;

      import javax.faces.bean.ManagedBean;

      import javax.faces.bean.SessionScoped;

       

       

      @ManagedBean

      @SessionScoped

      public class Bean implements Serializable{

          private static final long serialVersionUID = -9194353440404794097L;

         

          private int pos;

       

          public int getPos() {

              return pos;

          }

       

          public void setPos(int pos) {

              System.out.println("set pos:" + this.pos + " -> to -> " + pos);

              this.pos = pos;

          }

      }

       

      Output if not last element is selected

       

      set pos:0 -> to -> 2 (1)

      set pos:2 -> to -> 0

      set pos:0 -> to -> 0

      set pos:0 -> to -> 2

      set pos:2 -> to -> 0

      set pos:0 -> to -> 0

       

      Output if last element is selected

       

      set pos:0 -> to -> 4

      set pos:4 -> to -> 0

      set pos:0 -> to -> 0

      set pos:0 -> to -> 0

      set pos:0 -> to -> 0

      set pos:0 -> to -> 4

       

       

      What I do

       

      Selected the third radio box (with value 2) and hit the link element. Why is the setter method called so often?

      I expected: First click on the radio box: (1), then hit the ajax link element, maybe an additional line in console but not 5 with two which resets my value back to 0 ... In addition I posted the result if I select the last radio box (value 4) and hit the link. Works fine but also printed more lines out as excepted by me.

       

       

      Environement information

       

      - JSF2 & Richfaces4 Milestone4

      - Apache Tomcat 7

      - JAVA 6

       

       

      Would be grateful for each hint.

       

      Thanks,

      Thorsten

       

      updated - added more detailed information