function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Sudip MondalSudip Mondal 

Visualforce show/hide textbox on checkbox selection

Hi All,
I am new to sfdc and I am trying to achieve something that would be a novice task for most of you.

I have a checkbox in a vf page, now when the checkbox is checked I want to make a textbox visible. And similarly whenever the box will be unchecked, the textboxes must be hidden. 

Many thanks in advance in this regard.
Best Answer chosen by Sudip Mondal
Bhanu MaheshBhanu Mahesh
Hi sudip,

Try below code

VF page 
<apex:page controller="CheckboxRerenderController">
    <apex:form >    
        <apex:pageBlock >
            <apex:pageblocksection >
            <apex:inputcheckbox value="{!chkBx}" label="checkBox">    
                <apex:actionSupport event="onchange" rerender="thePanel" action="{!click}"/>    
            </apex:inputcheckbox> 
            <apex:outputPanel id="thePanel">    
                <apex:pageBlockSectionItem rendered="{!displayInputputText}">
                    <apex:outputLabel value="Input Text" />
                    <apex:inputText value="{!input}"/>  
                </apex:pageBlockSectionItem>
            </apex:outputPanel>
            </apex:pageblocksection>
        </apex:pageBlock>
    </apex:form>  
 </apex:page>

Controller 
public with sharing class CheckboxRerenderController { 
    
    public Boolean displayInputputText{get;set;}
    public Boolean chkBx{get;set;}
    public String input{get;set;}
       
    public PageReference click(){    
         if(chkBx){
             displayInputputText = true;
         }
         else{
             displayInputputText = false;
         }
         return null;
     }
}
Mark this as "SOLVED" if your query is answered

Regards,
Bhanu Mahesh

All Answers

Bhanu MaheshBhanu Mahesh
Hi sudip,

Try below code

VF page 
<apex:page controller="CheckboxRerenderController">
    <apex:form >    
        <apex:pageBlock >
            <apex:pageblocksection >
            <apex:inputcheckbox value="{!chkBx}" label="checkBox">    
                <apex:actionSupport event="onchange" rerender="thePanel" action="{!click}"/>    
            </apex:inputcheckbox> 
            <apex:outputPanel id="thePanel">    
                <apex:pageBlockSectionItem rendered="{!displayInputputText}">
                    <apex:outputLabel value="Input Text" />
                    <apex:inputText value="{!input}"/>  
                </apex:pageBlockSectionItem>
            </apex:outputPanel>
            </apex:pageblocksection>
        </apex:pageBlock>
    </apex:form>  
 </apex:page>

Controller 
public with sharing class CheckboxRerenderController { 
    
    public Boolean displayInputputText{get;set;}
    public Boolean chkBx{get;set;}
    public String input{get;set;}
       
    public PageReference click(){    
         if(chkBx){
             displayInputputText = true;
         }
         else{
             displayInputputText = false;
         }
         return null;
     }
}
Mark this as "SOLVED" if your query is answered

Regards,
Bhanu Mahesh
This was selected as the best answer
Sudip MondalSudip Mondal
Tried using the above code fragment. Didn't work. :(
I am not getting any errors but the result i.e; display of a textbox on the checkbox selection is not working.
Bhanu MaheshBhanu Mahesh
Hi Sudip,

The code snippet is working for me.
Try it again

Paste the code you have tried, if possible

Regards,
Bhanu Mahesh
 
Sudip MondalSudip Mondal

Hey,
The code you shared worked when used in a separate VF page. But when its used within an existing <apex:form> tag, its not returning the result. Apologies, can't post the code in here. 

Have put this up as a separate section on our existing VF page to display the inteded output.

Many thanks for your input in this regard. :)
devCareidevCarei
Hi Bhanu/Sudip,

I attempted to use this solution in my already existing VF page. It didn't work. Then I started narrowing it down to a text box's attribute: required=true. If I take this attribute off, it works. Else it fails. I am using a standard Account controller with an extension class. The text box is for city which in my requirement is a required field. Any help is greatly appreciated!