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
smita bhargavasmita bhargava 

Hide picklist based on selection from another picklist

I have 2 picklists countries & states, when I select a country it brings in the states. But my condition is if countries other than United States and Canada are selected then the state picklist should not be shown in the VF page, if the countries selected are United States & Canada only then states picklist should be shown. Here is the code I have but I am unable to achieve the above requirement
<apex:selectList value="{!fanCountry_Region}" size="1">                                                    
 <apex:selectOptions value="{!countriesList}"></apex:selectOptions>
 </apex:selectList>

 <apex:selectList id="StatesList" value="{!fanState}" size="1">                
 <apex:selectOptions value="{!statesList}"></apex:selectOptions>
  </apex:selectList>

public String fanCountry_Region { get; set; }
public String fanState { get; set; }
public List<selectOption> countriesList { 
        set; 
        get{

            List<selectOption> countriesList = new List<selectOption>();
            countriesList.add(new selectOption(' ','--Select--'));

            map<string,Countries__c> countryMap = Countries__c.getAll();
            List<string> countries = new List<string>();
            countries.addAll(countryMap.keySet());
            countries.sort();

            for(string country : countries){

                Countries__c c = countryMap.get(country);
                countriesList.add(new selectOption(c.CountryCode__c, c.Name));
            }

            return countriesList; 
        } 
    }

  public List<selectOption> statesList { 
        set; 
        get{

            List<selectOption> statesList = new List<selectOption>();

            Map<String, States__c> allstates = States__c.getAll();
            Map<string, States__c> states = new Map<string, States__c>();
            for(States__c state : allstates.values()) { 
                if (state.countryCode__c == fanCountry_Region) { 
                    states.put(state.name, state); 
                } 
            }

            List<String> stateNames = new List<String>(); 
            stateNames.addAll(states.keySet()); 
            stateNames.sort(); 

            for (String stateName : stateNames) { 
                States__c state = states.get(stateName); 
                statesList.add(new SelectOption(state.StateCode__c, state.Name)); 
            } 

            if (statesList.size() > 0) { 
                statesList.add(0, new SelectOption(' ', '-- Select One --')); 
            } else { 
                statesList.add(new SelectOption(' ', 'Not Required')); 
            }

            return statesList;  
        } 
    }


Please hlep me out.

Thanks
smita

 
diya khodabolediya khodabole
Hi smita refer below sample code 
<apex:page controller="customcontroller">
   <apex:form >
      <apex:actionFunction name="rerenderCity" rerender="citySelectList" >
          <apex:param name="firstParam" assignTo="{!country}" value="" />
      </apex:actionFunction>

   <table><tbody>
      <tr>
        <th>Country</th>
          <td>
             <apex:selectList id="country" styleclass="std" size="1" 
                value="{!country}" onChange="rerenderCity(this.value)">
                    <apex:selectOptions value="{!countriesSelectList}"/>
             </apex:selectList>
          </td>
      </tr>
      <tr id="city_input">
        <th>City</th>
          <td>
            <apex:selectList id="citySelectList" styleclass="std" size="1" 
                 value="{!city}">
                   <apex:selectOptions value="{!citySelectList}"/>
            </apex:selectList>
          </td>
      </tr>
   </tbody></table>
   </apex:form>
</apex:page>
 
public  class customcontroller {


    public String city { get; set; }
    public String country {get; set;}   

    // Generates country dropdown from country settings
    public List<SelectOption> getCountriesSelectList() {
        List<SelectOption> options = new List<SelectOption>();
        options.add(new SelectOption('', '-- Select One --'));        

        // Find all the countries in the custom setting
        Map<String, Country__c> countries = Country__c.getAll();
        
       
      
        
        // Create the Select Options.
       for (String countryName : countries.keySet()) {
            Country__c country = countries.get(countryName);
            options.add(new SelectOption(country.Name, country.Name));
        }
        return options;
    }
    
    // To generate the states picklist based on the country selected by user.
    public List<SelectOption> getcitySelectList() {
        List<SelectOption> options = new List<SelectOption>();
        // Find all the city we have in custom settings.
        Map<String, City__c> allcity = City__c.getAll();

        // Filter city that belong to the selected country
        Map<String, City__c> cities = new Map<String, City__c>();
        for(City__c city : allcity.values()) {
            if (city.Country__c == this.country) {
                cities.put(city.name, city);
            }
        }
        
       
        
      
        for (String cityName : cities.keySet()) {
            City__c city = cities.get(cityName);
            options.add(new SelectOption(city.Name, city.Name));
        }
        
       
        if (options.size() > 0) {
            options.add(0, new SelectOption('', '-- Select One --'));
        } else {
            options.add(new SelectOption('', 'Not Required'));
        }
        return options;
    }
}

Thanks,
Shruti Khodabole
Salesforce Developer
http://www.zen4orce.com
smita bhargavasmita bhargava
Hi Shruti

I am able to populate the countries and respective states into picklist, my code is working fine.
The only thing is the condition as I mentioned above.
somebody said u can use rendered attribute but I dont know how to proceed further.

Thanks
smitaB
Mustafa JhabuawalaMustafa Jhabuawala
Hi Smita,

You need to change the code a lil bit.

In the above code there is no callback to server side when user changes the country selection. Observe the actionfunction code, there is no action attribute written which will take the control to server side apex controller.

So basically you need to make a call to server side once user changes the selection and then depending on the selected country (i.e as per your condition if country is USA or Canada then only show state picklist) you need to set a boolean flag in the chnage action method in apex class which will be responsible to show or hide the state picklist.

For ex - 
<apex:selectList id="citySelectList" styleclass="std" size="1" value="{!city}" rendered="{!showState == true}">
    <apex:selectOptions value="{!citySelectList}"/>
</apex:selectList>
Here showState is a getter setter in your apex controller class of type boolean.

Hope this helps you to solve your problem.

Thanks,
Mustafa Jhabuawala
Technical Lead at Zen4orce (http://www.zen4orce.com)

    
Amol Salve 13Amol Salve 13
Hello Diya,

Use below code
<apex:actionFunction name="displayState" rerender="StatesListId" action="{!showStates}">
</apex:actionFunction>

 <apex:selectList value="{!fanCountry_Region}" size="1" onChange="displayState(this.value)">                                                    
 <apex:selectOptions value="{!countriesList}"></apex:selectOptions>
 </apex:selectList>

 <apex:selectList id="StatesListId" value="{!fanState}" size="1" rendered="{!statesList != null}">                
 <apex:selectOptions value="{!statesList}"></apex:selectOptions>
  </apex:selectList>

public String fanCountry_Region { get; set; }
public String fanState { get; set; }
public List<selectOption> statesList {get;set;}
public List<selectOption> countriesList { 
        set; 
        get{

            List<selectOption> countriesList = new List<selectOption>();
            countriesList.add(new selectOption(' ','--Select--'));

            map<string,Countries__c> countryMap = Countries__c.getAll();
            List<string> countries = new List<string>();
            countries.addAll(countryMap.keySet());
            countries.sort();

            for(string country : countries){

                Countries__c c = countryMap.get(country);
                countriesList.add(new selectOption(c.CountryCode__c, c.Name));
            }

            return countriesList; 
        } 
    }

  public void showStates() { 
		
		statesList = new List<selectOption>(); 
		Map<String, States__c> allstates = States__c.getAll();
		Map<string, States__c> states = new Map<string, States__c>();
		for(States__c state : allstates.values()) { 
			if (state.countryCode__c == fanCountry_Region) { 
				states.put(state.name, state); 
			} 
		}
		 if(fanCountry_Region.contains('United States') || fanCountry_Region.contains('Canada ') ){
			
			statesList = new List<selectOption>();
		 }else{
			
			for (String stateName : stateNames) {
                States__c state = states.get(stateName);
                statesList.add(new SelectOption(state.StateCode__c, state.Name));
            }
		 }
    }

Thank you,
Amol Salve
Salesforce Developer​
Mustafa JhabuawalaMustafa Jhabuawala
Smita,

So you can use either way -

1. As amol suggested you can use the code which will actually show an empty picklist if you select country USA or Canada

2. Or you can use rendered which will hide the picklist itself if you select country USA or Canada