I have a picklist with values as yes and no. On my vf i need to display the same as radio buttons and while saving the values i need to save them as picklist values from th controller.


You can change the dropdown to radio buttons with JavaScript also. First hide the dropdown, then take the data out of the elements and create the <input type="radio"/><label/><br/> for each one. On click of the radio, you have to update the dropdown so that it will save the correct data.

This solution is based on this stackoverflow link.

<apex:page standardController="Book__c" >
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <apex:form id="myForm">
        <apex:inputField value="{!Book__c.Country__c}" id="picklistfield"/>
        <apex:commandButton value="Save" action="{!Save}" />
    <script type="text/javascript">
        //Hide the picklist
        $('[id$=myForm] select').hide();
        //Get Exising Select Options    
        $('[id$=myForm] select').each(function(i, select){
            var $select = $(select);
            $select.find('option').each(function(j, option){
                var $option = $(option);
                // Create a radio:
                var $radio = $('<input type="radio" />');
                // Set name and value:
                $radio.attr('name', $select.attr('name')).attr('value', $option.val());
                // Set checked if the option was selected
                if ($option.attr('selected')) $radio.attr('checked', 'checked');
                // Insert radio before select box:
                // Insert a label:
                    $("<label/>").attr('for', $select.attr('name')).text($option.text())
                //Update the hidden picklist with selected radio value
                $radio.click(function () {
                    $('[id$=myForm] select').val($(this).val());
                // Insert a <br />:

Have an example here:

<apex:page standardController="Account" extensions="accEx">
        <apex:selectRadio value="{!Account.Active__c}">
            <apex:selectOptions value="{!Types}"></apex:selectOptions>

public class accEx {

    public accEx(ApexPages.StandardController controller) {    }

    public List<SelectOption> getTypes(){
        Schema.sObjectType sobject_type = Account.getSObjectType();
        Schema.DescribeSObjectResult sobject_describe = sobject_type.getDescribe();
        Map<String, Schema.SObjectField> field_map = sobject_describe.fields.getMap();
        List<Schema.PicklistEntry> pick_list_values = field_map.get('Active__c').getDescribe().getPickListValues();
        List<selectOption> options = new List<selectOption>();
        for (Schema.PicklistEntry a : pick_list_values) {
                  options.add(new selectOption(a.getLabel(), a.getValue()));
        return options;

It was working fine.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.