Bind a radiobutton to controller

Question

I have a pageBlockTable that gets its items from a database list from the controller

I'm trying to add in that pageblockTable a column for radiobuttons so the user can select only one row.

I tried this but the radiobuttons are not binded together(I can select more than one item)

     apex:pageBlockTable value="{!myContacts}" var="c" id="agents" style="margin-top:1em; width:880px">



            <apex:column >
              <apex:facet name="header"></apex:facet>
                <apex:selectRadio label="selectRadio" id="selectRadio" layout="pageDirection" value="{!c.selected}">

            </apex:selectRadio>
        </apex:column>

       <apex:column >
        <apex:facet name="header">Agent Details</apex:facet>
                <apex:outputField value="{!c.con.LastName}" />
       </apex:column>
</apex:pageBlockTable>

my controller

public List<cContact> myContacts {get;set;}


 public class cContact {  
    public Contact con {get; set;}  
    public boolean selected {get; set;}  


    public cContact(Contact c) {  
        con = c;  
        selected = false;  
    }  
}   

EDIT I also tried this

<apex:selectOptions value="{!items}" />

controller

 public List<SelectOption> getItems() {
        List<SelectOption> options = new List<SelectOption>(); 

        for(cContact c :myContacts)
        {
            options.add(new SelectOption('','')); 

        }


        return options; 
    }

but all the radio buttons were in one row.

Answer 1

So I used an html radio button for that.

    <apex:column >
 <apex:facet name="header"></apex:facet>
<input type="radio" name="group1" id="{!c.con.Id}" />
 </apex:column>

and I passed the selected radio button from my command button like this

<apex:commandButton onclick="getSelectedContact();"
    value="next" id="btn3"
    rerender="Msgs">
</apex:commandButton>
<apex:actionFunction name="next" action="{!next}" rerender="Msgs">
    <apex:param name="selected" value="" />
</apex:actionFunction>
<script>
 function getSelectedContact()
        {

            var $radio = $('input[name=group1]:checked');
            var updateDay = $radio.val();
            var id = $radio.attr('id');

             next(id);

        }
</script>

EDIT:

In my controller. I get the selected contact ID like this

 //get selected contact
   string Id = apexpages.currentpage().getparameters().get('selected');

Answer 2

The lack of <apex:inputCheckbox> is somewhat lamentable, but you could use the technique I described in a blog post. It does use checkboxes instead, but you'd only need a tiny amount of javascript to ensure only on box is selected at a time that could be fired from an onChange event.

Basically the idea is you have a map of record ID to boolean, and as you iterate over your records down the page you can bind checkboxes to this map using dynamic binding:

<apex:inputCheckbox value="{!theMap[c.Id]}" styleClass="radio" onChange="clearOthers(this);"/>

Where clearOthers() is a javascript funciton which unchecks all checkboxes with the class radio and then selectes the element passed to it.

This isn't th neatest solution when you want radio buttons but I just wanted to show an alternative to the method that @raym0nd proposed, though I'd likely use his in reality.

Answer 3

Check out the Salesforce example. Basically you need to populate the selectRadio tag via the selectOptions parameter.

<apex:selectRadio value="{!controllerBackingField}">
     <apex:selectOptions value="{!possibleValues}"/>
</apex:selectRadio>