Creating a dynamic multi-select picklist

Question

I currrently have a multi-select SelectList which whose options I am creating through a query. I now want to change it into a multi-select picklist with dual-columns. I am attempting to use this method as guidance :

Visual Force multi-select picklist

I am adapting my current code to somewhat fit that, and currently I have this :

public class MycontrollerSFDCBETA2{
public Account selectedUser { get; set; }
String contractid;
public Contract_Overview__c contract{get;set;}
public string relatedAccount{get;set;}
public string names{get;set;}
public string accountid{get;set;}
public Name contractnew{get;set;}
public string selectedaccountid{get;set;}
public String message { get; set; }

public List<String> selectedstring {get;set;}
public List<SelectOption> selectedsubs { get; set; }

public MycontrollerSFDCBETA2(apexpages.standardcontroller controller)
    {
    selectedsubs = new list<SelectOption>();
    List<String> selectedstring = new list<String>();

    contract = new Contract_Overview__c();
    contractid=system.currentpagereference().getparameters().get('id');
        if(contractid!=null)
        {
            contract=[select account__c,Subsidiaries_On_Contract__c from Contract_Overview__c  where id =:contractid];
            relatedAccount=Contract.account__C;
        }
    }

public pageReference  execute()
    {
    accountid=contract.Account__c;
    System.debug('########'+accountid);
    return null;
    }

public list<selectoption> getitems()
    {

    List<selectoption> options= new list<selectoption>();


    if(accountid != null)
        {
            account a =[select name , (select name from Subsidiaries_and_Brands__r) from account where id =:accountid];
    for(SubsidiariesAndBrands__c s : a.Subsidiaries_and_Brands__r)
                {
                options.add(new SelectOption(s.name,s.name));
                }
        }
    else
        options.add(new SelectOption('None','None'));
        return options;

    }

public void save()
    {

    System.debug('********************************' + names);
    System.debug('********************************' + selectedsubs);

    for(SelectOption so : selectedstring)
    {
       system.debug('Select vals ' + so.getValue());
       selectedstring.add(so.getValue());
    }

    contract.Subsidiaries_On_Contract__c= names;




    insert contract;
    contract=new Contract_Overview__c  ();
    System.debug('********************************' + contract);
       }          
    }

this line :

contract.Subsidiaries_On_Contract__c= names;

Will ultimately change with the picklist. That is what I am using now with the SelectList. But now I will only use names list to populate the left column (options) of the picklist. I need to use the value gathered from the right column of the picklist. I'm not sure how to do that. I don't know if I am properly setting up that right column list (SelectedSubs). I'm trying to turn it into a multi-value string with this :

for(SelectOption so : selectedstring)
    {
       system.debug('Select vals ' + so.getValue());
       selectedstring.add(so.getValue());
    }

I would be using the list SelectedSubs in the VF page as the value of the right picklist column :

<apex:pageBlock title="Subsidiaries">
        <c:MultiselectPicklist leftLabel="Available Subsidiaries"
            leftOptions="{!names}"
            rightLabel="Selected Subsidiaries"
            rightOptions="{!selectedSubs}"
            size="14"
            width="150px"/>
        <apex:pageBlockButtons >
            <apex:commandButton value="Save" action="{!save}"/>
        </apex:pageBlockButtons>
    </apex:pageBlock>

I would then try to put it into a field. but I'm not sure if that is the correct approach. I'm also getting an error from those lines ("Loop variable must be of type String").

Can anybody give me some feedback on this ? Should this work ?

Thank you very much for your help and effort. I really appreciate it.

Answer 1

I've had simliar requirements and the jQuery Multi-Select works fantastically well for this. In particular the filtered version is amazing if you have a lot of options to choose from.

Multi-Select w/Filters

Answer 2

The Multiselect Picklist component is a decent solution for what you want.

Answer 3

I'd take a look at this post for some pointers: http://www.tgerm.com/2012/01/ipad-multiselect-picklist-jquery-plugin.html

It's easy to setup, is re-usable and works really well...