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
Venkata Sravan Kumar BandariVenkata Sravan Kumar Bandari 

Hi, I hav an issue that I want to display an image when changing the values of picklist

Here is the code....Image is not displaying

<apex:page controller="Task_Picklist_onChange">
<apex:form id="show">
  <apex:pageblock >
  <apex:pageblockSection >
      <apex:outputPanel >
          <apex:selectList value="{!colors}" size="1">
              <apex:actionSupport event="onChange" action="{!display}" reRender="show" />
              <apex:selectOptions value="{!images}"/>
          </apex:selectList>
      </apex:outputPanel>
  </apex:pageblockSection>
  </apex:pageblock>
  <apex:outputPanel >
  <apex:image rendered="{!colors = 'Green'}" value="{!$Resource.Green}" width="200" height="200"/>
  <apex:image rendered="{!colors = 'Red'}" value="{!$Resource.Red}" width="200" height="200"/>
  <apex:image rendered="{!colors ='Yellow'}" value="{!$Resource.Yellow}" width="200" height="200"/>
  <apex:image rendered="{!colors ='Orange'}" value="{!$Resource.Orange}" width="200" height="200"/>
  </apex:outputPanel>
</apex:form>
</apex:page>



public with sharing class Task_Picklist_onChange {

    String Color;
   
    public PageReference display() {
        return null;
    }

    public String images { set; }
    
    public list<selectoption> getimages() {
    
        list<selectoption> image = new list<selectoption>();
        image.add(new selectoption('None','No'));
        image.add(new selectoption('Green','Green'));
        image.add(new selectoption('Red','Red'));
        image.add(new selectoption('yellow','Yellow'));
        image.add(new selectoption('Orange','Orange'));
        return image;
    }

    public String colors { get; }
    
    Public String setcolors(String colors) {
    System.debug(colors);
    color = colors;
    return color;
}
}
Best Answer chosen by Venkata Sravan Kumar Bandari
SonamSonam (Salesforce Developers) 
Use the code below:

VF:

<apex:page controller="Task_Picklist_onChange">
<apex:form >
  <apex:pageblock >
  <apex:pageblockSection >
      <apex:outputPanel >
         <apex:selectList value="{!colors}" size="1" title="Color"> 
             <apex:selectOptions value="{!images}"/>
             <apex:actionSupport event="onchange" reRender="show"/>
          </apex:selectList>
          
      </apex:outputPanel>
  </apex:pageblockSection>
  </apex:pageblock>
  
  <apex:outputPanel id="show">
  
  <apex:image rendered="{!colors = 'Green'}" value="{!$Resource.Green}" width="200" height="200"/>
  <apex:image rendered="{!colors ='Red'}" value="{!$Resource.Red}" width="200" height="200"/>
  <apex:image rendered="{!colors ='Yellow'}" value="{!$Resource.Yellow}" width="200" height="200"/>
  <apex:image rendered="{!colors ='Orange'}" value="{!$Resource.Orange}" width="200" height="200"/> 
  </apex:outputPanel>
</apex:form>
</apex:page>

Controller:

public with sharing class Task_Picklist_onChange {
String colors;
  
   
    public PageReference display() {
        return null;
    }

    public String images { set; }
    
    public list<selectoption> getimages() {
    
        list<selectoption> image = new list<selectoption>();
        image.add(new selectoption('None','No'));
        image.add(new selectoption('Green','Green'));
        image.add(new selectoption('Red','Red'));
        image.add(new selectoption('yellow','Yellow'));
        image.add(new selectoption('Orange','Orange'));
        return image;
    }


   public String getcolors() {
        return colors;
    }
    
Public void setcolors(String colors) {
    this.colors = colors; 
}
}
 

All Answers

Anoop yadavAnoop yadav
Hi,

Check the below link and change accordingly.
http://www.infallibletechie.com/2012/10/dependent-picklist-using-apex-in.html
Anoop yadavAnoop yadav
Hi,

I made some changes in your code.
Try the below one.
  
public with sharing class Task_Picklist_onChange {

    String Color;
   
    public PageReference display() {
        return null;
    }

    public String images { set; }
    
    public list<selectoption> getimages() {
    
        list<selectoption> image = new list<selectoption>();
        image.add(new selectoption('None','No'));
        image.add(new selectoption('Green','Green'));
        image.add(new selectoption('Red','Red'));
        image.add(new selectoption('Yellow','Yellow'));
        image.add(new selectoption('Orange','Orange'));
        return image;
    }

    public String colors { get; set;}
    
    Public String setcolors(String colors) {
    System.debug(colors);
    color = colors;
    return color;
}
}
<apex:page controller="Task_Picklist_onChange">
<apex:form id="show">
  <apex:pageblock >
  <apex:pageblockSection >
      <apex:outputPanel >
          <apex:selectList value="{!colors}" size="1">
              <apex:actionSupport event="onchange" action="{!display}" reRender="show" />
              <apex:selectOptions value="{!images}"/>
          </apex:selectList>
      </apex:outputPanel>
  </apex:pageblockSection>
  </apex:pageblock>
  <apex:outputPanel >
  <apex:image rendered="{!colors = 'Green'}" value="{!$Resource.Green}" width="200" height="200"/>
  <apex:image rendered="{!colors = 'Red'}" value="{!$Resource.Red}" width="200" height="200"/>
  <apex:image rendered="{!colors ='Yellow'}" value="{!$Resource.Yellow}" width="200" height="200"/>
  <apex:image rendered="{!colors ='Orange'}" value="{!$Resource.Orange}" width="200" height="200"/>
  </apex:outputPanel>
</apex:form>
</apex:page>


 
SonamSonam (Salesforce Developers) 
Use the code below:

VF:

<apex:page controller="Task_Picklist_onChange">
<apex:form >
  <apex:pageblock >
  <apex:pageblockSection >
      <apex:outputPanel >
         <apex:selectList value="{!colors}" size="1" title="Color"> 
             <apex:selectOptions value="{!images}"/>
             <apex:actionSupport event="onchange" reRender="show"/>
          </apex:selectList>
          
      </apex:outputPanel>
  </apex:pageblockSection>
  </apex:pageblock>
  
  <apex:outputPanel id="show">
  
  <apex:image rendered="{!colors = 'Green'}" value="{!$Resource.Green}" width="200" height="200"/>
  <apex:image rendered="{!colors ='Red'}" value="{!$Resource.Red}" width="200" height="200"/>
  <apex:image rendered="{!colors ='Yellow'}" value="{!$Resource.Yellow}" width="200" height="200"/>
  <apex:image rendered="{!colors ='Orange'}" value="{!$Resource.Orange}" width="200" height="200"/> 
  </apex:outputPanel>
</apex:form>
</apex:page>

Controller:

public with sharing class Task_Picklist_onChange {
String colors;
  
   
    public PageReference display() {
        return null;
    }

    public String images { set; }
    
    public list<selectoption> getimages() {
    
        list<selectoption> image = new list<selectoption>();
        image.add(new selectoption('None','No'));
        image.add(new selectoption('Green','Green'));
        image.add(new selectoption('Red','Red'));
        image.add(new selectoption('yellow','Yellow'));
        image.add(new selectoption('Orange','Orange'));
        return image;
    }


   public String getcolors() {
        return colors;
    }
    
Public void setcolors(String colors) {
    this.colors = colors; 
}
}
 
This was selected as the best answer
Venkata Sravan Kumar BandariVenkata Sravan Kumar Bandari
Hi Anoop, its not working.

Hi Sonam, it is also not working.
SonamSonam (Salesforce Developers) 
Its working at my end when I use the same code.
Did you make any changing in the cde by any chance:
User-added image
 
Venkata Sravan Kumar BandariVenkata Sravan Kumar Bandari
Hi Sonam, Thank u soooo much. Its working. ur profile page is not opening....jst for twitter id to follow u.