Ajax with JSF

[Gopu Akraju]

As I am using JSF for frontend, I have a siutuation as below and I think Ajax would solve the situation even though I have not used ajax before. Please give some suggestions.

I have a jsf form with two option button "yes" or "no". If the user selects "yes" option button, the I need to show a drop down menu for the user to select. And if the user selects "no", then no action is needed. Kidly suggest me whether Ajax would be a better option.

Thanks.

[Gopu Akraju]

Can it be done though event handling of JSF components without AJAX? I am looking for the possibility. Thanks.

[Tim Holloway]

Originally posted by Gopu Akraju:
Can it be done though event handling of JSF components without AJAX? I am looking for the possibility. Thanks.

Yes, although it requires a page refresh. In that case, use the "render=" attribute on the drop down menu and make it refer to a backing bean variable that gets set by the "yes" option button.

AJAX-enabled JSF tags, such as RichFaces can also handle this using a partial page request.

[Gopu Akraju]

Thanks Tim.

I have a set of radio buttons, YES and NO. I want to add the value change listener for selectonemenu item and then calling a method (render.javaMethod) on valuechangelistener.

I could understand up to this step. If the user selects YES, I have to display a list of numbers from 1 till 9 as a drop down menu and then depending upon the user's selection from the number, I have to use a backing bean to write to a database.

Can anyone please explain how to do this? I really don't understand on "refresh" part too. B'cos I need to see the change before I submit my form. Thanks.

[Joe Matthew]

One of the benefits of using AJAX is that the page does not refresh. Much better UI to the user.

But if you want to use JSF only, on clicking the radio button, the page will be refreshed with your drop down displayed.

[Gopu Akraju]

Yes, Thanks. refresh is working now. And I am able to catch the value change as below with some system.out.printlns. I still have some abouts about how to display a list of numbers if the radio button value is "yes".

 <h:outputLabel for="testLane">
                            <h:outputText value="Test Lane:"/>
                        </h:outputLabel>                      
                        <h:selectOneRadio id="testLane"  value="#{UserBean.testLane}" immediate="true" valueChangeListener="#{UserBean.listMethod}" onchange="submit()">                            
                            <f:selectItems value="#{testLane}"/>
                        </h:selectOneRadio> 

My method is also getting triggered when there is change in the selection of radio button as below:

public void listMethod(ValueChangeEvent event){
        System.out.println("Inside Valuechange");
        FacesContext facesContext = FacesContext.getCurrentInstance();
        HtmlSelectOneRadio radio = (HtmlSelectOneRadio)event.getComponent();
        String label = (String)radio.getValue();
        System.out.println("Radio label is " + label );
        if ("yes".equals(label)){
            System.out.println("Have to disply");            
            [B]//How to display "{#testLaneList}"[/B]
        }
        
    }

Now my doubt is how to pass or display to list the set of numbers(ie "{#testLaneList}") if the radio button value is "yes"

<h:selectOneMenu id= "lanes" attribute? I don't know this part value="#{controlLaneList}"> </h:selectOneMenu>

Can any one tell how to achieve this? I know that I am just few steps to reach my goal. As I don't find any suitable example, I am kind of stuck here.

[Gopu Akraju]

Yes, I managed to like below:

Setting the boolean value in java method.

booleanValue=true; 

from jsp page:

<h:selectOneRadio id="testLane"  value="#{UserBean.testLane}" immediate="true" valueChangeListener="#{UserBean.listMethod}" onchange="submit()">                            
                            <f:selectItems value="#{testLane}"/>
                        </h:selectOneRadio> 
                        <h:selectOneMenu id= "lanesList" rendered="#{UserBean.booleanValue}" value="#{UserBean.selectedLaneList}"> 
                            <f:selectItems value="#{testLaneList}"/>
                        </h:selectOneMenu> 

Thanks and it works.

[Jan Groth]

From the user point of view, I would definitely recommend to skip any AJAX magic. I would display a disabled dropdown, which gets enabledif yes is clicked, and stays untouched otherwise.

The key point is that in this scenario the user has an idea of what is going to happen if he clicks on the radio button, and no fields will appear automagically.

From the techie point of view - use AJAX. it's cool.

:-)

jan

[Gopu Akraju]

Hi Jan,

Actually I am not using ajax now and tru=ying to use valuechangelistener as explained here

But I have some difficulities in binding the component value, if possible please go through that thread and give me your feedback. Dying to figure out for the past 2 days

Thanks and Regards
Gopu