Custom Picklist in Visualforce Page

If we have a picklist field then it can be displayed using inputfield tag easily. But if we want to display custom values in the picklist, it can not be done using inputfield tag. We can display custom picklist using ‘selectList’ tag in visualforce. We can display values or options for custom picklist using ‘selectOption’ or ‘selectOptions’ tag.

In the example below, We are showing a picklist which is dynamically getting the values from the apex code. We are setting selectOption list using apex code.

Visualforce Page:

<apex:page controller="customPickListInVFDemoController" tabStyle="Contact">
  <apex:form >
    <apex:pageBlock title="Custom PickList Demo" id="pblock">
        <apex:pageBlockButtons >
            <apex:commandButton value="Save" action="{!save}" rerender="pblock" status="conStatusId"/>
            <apex:actionStatus id="conStatusId">
                <apex:facet name="start">
                    <img src="/img/loading.gif" />
                </apex:facet>
            </apex:actionStatus>
        </apex:pageBlockButtons>
         
        <apex:pageBlockSection title="Custom Picklist Using selectList and selectOptions" collapsible="false">
            <apex:selectList value="{!selectedCountry}" multiselect="false" size="1">
                <apex:selectOptions value="{!countriesOptions}"/>
            </apex:selectList>
             
            <apex:outputText value="{!selectedCountry}" label="You have selected:"/>
        </apex:pageBlockSection>
      </apex:pageBlock>
  </apex:form>
</apex:page>

Apex Code:

public class customPickListInVFDemoController {
public String selectedCountry{get;set;}
    public customPickListInVFDemoController(){
    }
     
    public List<SelectOption> getCountriesOptions() {
        List<SelectOption> countryOptions = new List<SelectOption>();
        countryOptions.add(new SelectOption('','-None-'));
        countryOptions.add(new SelectOption('INDIA','India'));
        countryOptions.add(new SelectOption('USA','USA'));
        countryOptions.add(new SelectOption('United Kingdom','UK'));
        countryOptions.add(new SelectOption('Germany','Germany'));
        countryOptions.add(new SelectOption('Ireland','Ireland'));
 
        return countryOptions;
    }
    public PageReference save(){
        return null;
    }
}

Output: