Get value of selectOption and populate value elsewhere on Visualforce page

Question

I'm trying to take a selectOptions component, and display/manipulate it's value once selected onclick. So far I'm able to place actionSupport inside of my selectList but I'm not sure how to actually call out the value. I'm sure this has to be easy and I'm just missing it. But if anyone could show me how to "when you click on the value in the picklist, it will display in the outputtext". Or how to call it via a controller because that will be phase II. Thanks in advance

<apex:selectList label = "Fields" value="{!selectedFields}" multiselect="false" size="10">
     <apex:selectOptions value="{!fieldOptions}" id="field"/>
     <apex:actionSupport event="onclick" rerender="values"/>
</apex:selectList>

<apex:outputText value="{!field}???" label="You have selected:" id="values" />

---

Controller code - used to populate all fields in the for an object and return their label for the value and API name for the Id in the selectOption.

public String selectedFields{get;set;}
public List<SelectOption> getFieldOptions() {
    List<SelectOption> fieldOptions = new List<SelectOption>();
    fieldOptions.add(new SelectOption('','-None-'));
    String SobjectAPIName = 'Product2';
    List<String> fieldNames;

    List<Schema.DescribeSObjectResult> describeSobjectsResult = Schema.describeSObjects(new List<String>{SobjectAPIName}); // this can accept list of strings, we describe only one object here
    System.debug(describeSobjectsResult);

    String objectLabel = describeSobjectsResult[0].getLabel();
    System.debug('objectLabel => ' + objectLabel);

    fieldNames = new List<String>(describeSobjectsResult[0].fields.getMap().keySet());

    Map<String, Schema.SObjectField> allFields = describeSobjectsResult[0].fields.getMap();
    System.debug(fieldNames);

    for(String f : fieldNames){
        String fieldLabel = allFields.get(f).getDescribe().getLabel();
        System.debug(SobjectAPIName + '.' + f + '  => ' + objectLabel + ', ' + fieldLabel);
        fieldOptions.add(new SelectOption(f, fieldLabel));
    }

    return fieldOptions;
}

Answer 1

You can try out something like this:

Visualforce

<apex:selectList label = "Fields" value="{!selectedFields}" multiselect="false" size="10">
 <apex:selectOptions value="{!fieldOptions}" id="field"/>
 <apex:actionSupport event="onchange" reRender="values" action="{!passValueToController}"/>
</apex:selectList>
<apex:outputText value="{!fieldValue}" label="You have selected:" id="values" />

Controller

public String fieldValue {get; set;}
public void passValueToController(){
    fieldValue = selectedFields;
}