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; 
}
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>
  • 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. – sfdcFanBoy May 28 '14 at 9:48
  • @BruceLee It is a next question bro :) – Sergej Utko May 28 '14 at 9:59
  • haha.. Do I need to create a new one? :) – sfdcFanBoy May 28 '14 at 10:10

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.