function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
virvir 

Render two sections based on a user input to a check box

I want to hide and display two sections based on a user input to a checkbox. In my page I have two sections called section1 and section2. I want to display only section1 when user checks the check box. And display only section2 when user unchecks check box. This works only for section1.

 

<apex:page controller="Sample" >
  <apex:form >  
      <apex:pageBlock id="trainersBlock">
          <apex:inputCheckbox id="isEmp" value="{!isChecked}" >
              <apex:actionsupport event="onclick" rerender="SampleView" />
          </apex:inputCheckbox>
          
          <apex:outputPanel id="SampleView">
              <apex:pageBlockSection rendered="{!isChecked}">
                  <apex:pageblockSectionItem >
                  <apex:outputlabel value="Section 1"/>
                  </apex:pageblockSectionItem>                           
              </apex:pageBlockSection>
              <apex:pageBlockSection rendered="{!isChecked} == false">
                  <apex:pageblockSectionItem >
                  <apex:outputlabel value="Section 2"/>  
                  </apex:pageblockSectionItem>                        
              </apex:pageBlockSection>
          </apex:outputPanel>
       </apex:pageBlock>
  </apex:form>
</apex:page>

 Controller:

public class Sample {

    public String isChecked { get; set; }
}

 

Best Answer chosen by Admin (Salesforce Developers) 
Shashikant SharmaShashikant Sharma

Please use this

 

public class Sample {

    public Boolean isChecked { get; set; }
}

 VFP

 

<apex:page controller="Sample" >
  <apex:form >  
      <apex:pageBlock id="trainersBlock">
          <apex:inputCheckbox id="isEmp" value="{!isChecked}" >
              <apex:actionsupport event="onclick" rerender="SampleView" />
          </apex:inputCheckbox>
          
          <apex:outputPanel id="SampleView">
              <apex:pageBlockSection rendered="{!isChecked}">
                  <apex:pageblockSectionItem >
                  <apex:outputlabel value="Section 1"/>
                  </apex:pageblockSectionItem>                           
              </apex:pageBlockSection>
              <apex:pageBlockSection rendered="{!IF(isChecked = true , false , true)}">
                  <apex:pageblockSectionItem >
                  <apex:outputlabel value="Section 2"/>  
                  </apex:pageblockSectionItem>                        
              </apex:pageBlockSection>
          </apex:outputPanel>
       </apex:pageBlock>
  </apex:form>
</apex:page>

 I have tested it , works fine, I hope it will help you.

All Answers

uptime_andrewuptime_andrew

Try: 

 

<apex:page controller="Sample" >
  <apex:form >  
      <apex:pageBlock id="trainersBlock">
          <apex:inputCheckbox id="isEmp" value="{!isChecked}" >
              <apex:actionsupport event="onclick" rerender="SampleView" />
          </apex:inputCheckbox>
          
          <apex:outputPanel id="SampleView">
              <apex:pageBlockSection rendered="{!isChecked}">
                  <apex:pageblockSectionItem >
                  <apex:outputlabel value="Section 1"/>
                  </apex:pageblockSectionItem>                           
              </apex:pageBlockSection>
              <apex:pageBlockSection rendered="{!if(isChecked==false,true,false)}">
                  <apex:pageblockSectionItem >
                  <apex:outputlabel value="Section 2"/>  
                  </apex:pageblockSectionItem>                        
              </apex:pageBlockSection>
          </apex:outputPanel>
       </apex:pageBlock>
  </apex:form>
</apex:page>

 

Shashikant SharmaShashikant Sharma

Please use this

 

public class Sample {

    public Boolean isChecked { get; set; }
}

 VFP

 

<apex:page controller="Sample" >
  <apex:form >  
      <apex:pageBlock id="trainersBlock">
          <apex:inputCheckbox id="isEmp" value="{!isChecked}" >
              <apex:actionsupport event="onclick" rerender="SampleView" />
          </apex:inputCheckbox>
          
          <apex:outputPanel id="SampleView">
              <apex:pageBlockSection rendered="{!isChecked}">
                  <apex:pageblockSectionItem >
                  <apex:outputlabel value="Section 1"/>
                  </apex:pageblockSectionItem>                           
              </apex:pageBlockSection>
              <apex:pageBlockSection rendered="{!IF(isChecked = true , false , true)}">
                  <apex:pageblockSectionItem >
                  <apex:outputlabel value="Section 2"/>  
                  </apex:pageblockSectionItem>                        
              </apex:pageBlockSection>
          </apex:outputPanel>
       </apex:pageBlock>
  </apex:form>
</apex:page>

 I have tested it , works fine, I hope it will help you.

This was selected as the best answer
virvir

Thanks for borth replies. Mainly the error was in:

 

public String isChecked { get; set; }

 As in the accepted solution, that should be like:

 

public Boolean isChecked { get; set; }

 

Thanks again!