How to pass multiple selected values from apex:selectList to controller?

Question

I haven't been able to find an answer to this as all the answers are somewhat different to what I'm trying to achieve.

Summary before giving the details:

• apex:selectList where the values are dynamically generated from the controller
• When the user clicks a button, I want the MULTIPLE (all the examples I've found are with one value)selected values to be passed to a List variable on the controller
• I'm not interested in passing the values every time they change, I want them to be passed when the button is clicked
• Optionally, when the button is clicked, I want the selected values to be displayed so that the user can confirm them.

Controller where the values are generated:

    //the variable holding the selected values, supposedly
    public List<String> typeMembers{get;set;}

    //the available options
    public List<SelectOption> getMembers(){

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

    for(String member : OrgMetadata.ListMetadata('CustomObject')){
        options.add(new SelectOption(member,member));
    }

    return options;  
}

Then, this is referenced in the markup:

<apex:selectList value="{!typeMembers}" multiselect="true" size="10" id="memberList">
            <apex:selectOptions value="{!members}"/>
        </apex:selectList>

Button to retrieve the selected values:

 <apex:commandButton action="{!retrieveSelectedValues}" reRender="selectedValuesPanel" value="Select" status="status"/>

When I see the debug log, the method retrieveSelectedValues is not printing anything

public PageReference retrieveSelectedValues(){

    System.debug('Selected Values: '+typeMembers);

    return null;
}

I have tried the alternative approach, calling retrieveSelectedValues on the onChange attribute of the selectList itself

<apex:selectList value="{!typeMembers}" multiselect="true" size="10" id="memberList">
            <apex:selectOptions value="{!members}"/>
            <apex:actionSupport event="onchange" reRender="selectedValuesPanel" action="{!retrieveSelectedValues}" />
        </apex:selectList>

Everytime I select a new value, retrieveSelectedValues is called, but the debug log doesn't show anything.

What am I missing?

Answer 1

I figured this out. Either this is some bug or a strange behaviour that I've never seen documented. The problem is I had 2 apex:selectList inside the same apex:form.

The moment I put them in separate apex:form tags, I was able to get the values that were selected.

Answer 2

Below is working without any issue. Don't need an action support for this on button click you can re-render output panel if needed and if you don't want to refresh whole form.

public class selectTest {
    String[] countries = new String[]{};
        public List<String> typeMembers{get;set;}
    public PageReference test() {
        return null;
    }

    public List<SelectOption> getItems() {
        List<SelectOption> options = new List<SelectOption>();
        options.add(new SelectOption('US','US'));
        options.add(new SelectOption('CANADA','Canada'));
        options.add(new SelectOption('MEXICO','Mexico'));
        return options;
    }
    public List<SelectOption> getMembers(){

        List<SelectOption> options = new List<SelectOption>();
        options.add(new SelectOption('mem 1','mem 1'));
        options.add(new SelectOption('mem2','mem2'));
        options.add(new SelectOption('mem 3','mem3'));        
        return options;  
    }
    public String[] getCountries() {
        //If multiselect is false, countries must be of type String
        return countries;
    }

    public void setCountries(String[] countries) {
        //If multiselect is false, countries must be of type String
        this.countries = countries;
    }
}

    <apex:page controller="selectTest">
        <apex:form >
            <apex:selectList value="{!countries}" multiselect="true">
                <apex:selectOptions value="{!items}"/>
            </apex:selectList><p/>
            <p>
                <apex:selectList value="{!typeMembers}" multiselect="true" size="10" id="memberList">
                    <apex:selectOptions value="{!members}"/>
                </apex:selectList>
            </p>
            <apex:commandButton value="Test" action="{!test}" rerender="out" status="status"/>
        </apex:form>

        <apex:outputPanel id="out">
            <apex:actionstatus id="status" startText="testing...">
                <apex:facet name="stop">
                    <apex:outputPanel >
                        <p>You have selected:</p>
                        <apex:dataList value="{!countries}" var="c">{!c}</apex:dataList>
                         <apex:dataList value="{!typeMembers}" var="t">{!t}</apex:dataList>
                    </apex:outputPanel>
                </apex:facet>
            </apex:actionstatus>
        </apex:outputPanel>
    </apex:page>