5

On selecting Yes/No from the selectRadio options, outputPanel reRender is not working

Here's the code

I have 2 radio buttons.. yes/no. If user clicks Yes, it should display the outputPanel. If No, the outputpanel should hide. Its simple. But Im missing something. Here's my code.

<apex:selectRadio id="selectedAPTransport" value="{!selectedAPTransport}">
     <apex:selectOptions value="{!ListAPTransport}"/>                                        
     <apex:actionSupport event="onchange" reRender="Travel_block" />
</apex:selectRadio>                                 

<apex:outputPanel id="Travel_block" rendered="{!IF(selectedAPTransport == 'Yes',true,false)}" >
     <apex:repeat id="TravelNeeded" value="{!map}" var="item" > 
     <!-- columns -->                              
     </apex:repeat>
</apex:outputPanel>

Apex class

public String selectedAPTransport {get; set;} 

public List<SelectOption> getListAPTransport() {
    List<SelectOption> options = new List<SelectOption>(); 
    options.add(new SelectOption('Yes','Yes')); 
    options.add(new SelectOption('No','No')); 
    return options; 
}

public String getselectedAPTransport() {
    return selectedAPTransport;
}

public void setselectedAPTransport(String selectedAPTransport) {    
    this.selectedAPTransport = selectedAPTransport; 
}

1 Answer 1

10

Your apex:outputPanel with id="Travel_block" is not rendered by default, because the selectedAPTransport variable is not Yes. If it is not rendered, then it is not accessible by ID for actionSupport. You need to wrap this pannel with another panel without layout and rerender it (wrapperPannel in my example):

<apex:selectRadio value="{!selectedAPTransport}">
     <apex:selectOptions value="{!ListAPTransport}"/>                                        
     <apex:actionSupport event="onchange" reRender="wrapperPannel" />
</apex:selectRadio>                                 

<apex:outputPanel id="wrapperPannel" layout="none">
    <apex:outputPanel id="Travel_block" rendered="{!IF(selectedAPTransport == 'Yes',true,false)}" >
        <apex:repeat value="{!mapApplicantProduct['Travel']}" var="item" >                                  
          <apex:inputCheckbox id="Selected" value="{!item.selected}" required="True"/>
          <apex:outputText id="ApplicantProduct_Description" value="{!item.applicantProduct.Description__c}"/>    
     </apex:repeat>
    </apex:outputPanel>
</apex:outputPanel>
3
  • Thanks mate. It did indeed work. Now the problem is, after the outputPanel becomes visible, the required="true" condition doesn't work for the inputCheckbox. Commented May 28, 2014 at 9:48
  • @BruceLee It is a next question bro :) Commented May 28, 2014 at 9:59
  • haha.. Do I need to create a new one? :) Commented May 28, 2014 at 10:10

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .