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
RockersRockers 

How to write the javascript to show the text field based on the selected checkbox?

Hi Friends,

 

            I have developed the page to show the contents of Partners details in a list of check boxes. Here, in that list, we have a option "other". when i select that check box, one text field has to show on the page.

 

          Please suggest me how to write the javascript for this.

 

         Thanks in advance.....

 

Regards,

Phanikumar

Navatar_DbSupNavatar_DbSup

Hi,

 

Try the below code snippet as reference

 

======================== Vf page====================
<apex:page controller="clsmultiplechkboxchkfromcontroller" id="p1" >
<script>
function Showdiv(var1)
{
    
    var getchkboxvalue=var1.value;
   if(getchkboxvalue=='Other' && var1.checked==true)
   {
      
       document.getElementById('showtext').style.display='block';
   }
   if(getchkboxvalue=='Other' && var1.checked==false)
   {
      document.getElementById('showtext').style.display='none';
   }
   {
   
   }
    
}

</script>

 <apex:form id="f1" >
 <div id="showtext" style="display:none;">
  <apex:inputText id="oText"  value="{!otherText}"/>
 </div>
 <Apex:selectCheckboxes onchange="Showdiv(this)" value="{!getselected}"   >
<apex:selectOptions value="{!items}"/>
 
 </Apex:selectCheckboxes>
  
 <apex:commandButton id="aa" action="{!display1}"  value="Display" oncomplete="alert('{!getselected}')"/> 
  </apex:form>
</apex:page>

================== Apex Controller ========================

public class clsmultiplechkboxchkfromcontroller 
{

    public String other { get; set; }
    public String otherText{get; set; }
public list<selectOption>items{get;set;}
public list<string>getselected{get;set;}
public clsmultiplechkboxchkfromcontroller()
{
    items=new  list<selectOption>();
    getselected=new list<string>();
    getselected.add('a0');
    getselected.add('a3');
    getselected.add('a5');
    for(integer i=0;i<10;i++)
    {
        items.add(new SelectOption('a'+string.valueof(i),'a'+string.valueof(i)));
    }
    items.add(new SelectOption('Other','Other'));
}
public void display1(){}
}

 

Did this answer your question? If not, let me know what didn't work, or if so, please mark it solved.