Converting Multi-Select picklist to Multi-Select checkboxes in VF page.

Converting Multi-Select picklist to Multi-Select checkboxes in VF page.

Converting Multi-Select pick-list to Multi-Select check-boxes in VF page.

In this post i am providing an example of converting Multi Select Pick-list to  convert Multi Select Chyeckboxes in VF page.

For this i created a Multi-Select Pick-list field on opportunity page with some values.

Using custom controller extension in VF page.

Controller Class:

public class MultiCheckBoxExtn {

    public opportunity opp{get;set;}

    public List<SelectOption> leadSourceCheckbox {get;set;}

    

    public MultiCheckBoxExtn(ApexPages.StandardController controller) {

        opp = (opportunity)controller.getRecord();

    }

    

    public void saveOpp(){

    system.debug('opp.Srinivas__Multi_Select_Pick_List__c==>'+opp.Srinivas__Multi_Select_Pick_List__c);

     upsert opp;

    }

    

    

  

 //get the multi-select pick list values

    public List<SelectOption> MPOptions {

     get {

       List<SelectOption> options = new List<SelectOption>();

       for( Schema.PicklistEntry f : opportunity.Srinivas__Multi_Select_Pick_List__c.getDescribe().getPicklistValues()) {

         options.add(new SelectOption(f.getValue(), f.getLabel()));

        } 

       return options;

     }  

     set;

    }

    

    

    //get and set the multi-select pick list as checkboxes

       public String[] MPItems { 

     get {

        String[] selected = new List<String>();

        List<SelectOption> sos = this.MPOptions;

        for(SelectOption s : sos) {

        if (this.opp.Srinivas__Multi_Select_Pick_List__c !=null && this.opp.Srinivas__Multi_Select_Pick_List__c.contains(s.getValue()))

           selected.add(s.getValue());

        }

        return selected;

     }public set {

        String selectedCheckBox = '';

        for(String s : value) {

         if (selectedCheckBox == '') 

           selectedCheckBox += s;

         else selectedCheckBox += ';' + s;

        }

        opp.Srinivas__Multi_Select_Pick_List__c = selectedCheckBox;

     }

   } 

 }

VF page : 

<apex:page standardController="Opportunity" extensions="MultiCheckBoxExtn" tabStyle="Opportunity" id="thepg">

<apex:pagemessages ></apex:pagemessages>

    <apex:form id="theFm" >

     <apex:pageBlock id="thePB" >

        <apex:pageblockSection title="Opporutnity Details" id="thePbs1" collapsible="false">

         <apex:inputfield value="{!opp.name}" id="name1"/>

         <apex:inputField value="{!opp.closeDate}"/>

          <apex:inputField value="{!opp.stageName}"/>

        </apex:pageblockSection>

     

         <apex:pageBlockSection title="Multiselect Picklist to Checkbox" columns="2" collapsible="false" id="thePbs2">

         <apex:outputLabel value="{!$ObjectType.opportunity.Fields.Multi_Select_Pick_List__c.InlineHelpText}" />

           <apex:selectcheckboxes layout="pageDirection"  value="{!MPItems}" label="" id="checkbox1">                   

             <apex:selectoptions value="{!MPOptions}"  > </apex:selectoptions>       

            </apex:selectcheckboxes>

         </apex:pageBlockSection>

        

        <apex:pageblockButtons >

         <apex:commandButton value="Save" action="{!saveOpp}"/>

        

        </apex:pageblockButtons>

        </apex:pageBlock>

    

    </apex:form>

</apex:page>

Once the user clicks  on the save button it will set the check box values into multi select pick-list 

If you edit the record it will show the multiselect picklist like this.