6

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.

  • It's asinine that the apex:selectRadio component works in this way, all it needs is a name attribute. I'm not sure how they missed the ability to group radio buttons freely. – Phil Rymek Sep 19 '13 at 21:37
  • Hi, I'm having the same issue as you. Were you able to figure this out? Thanks. – user3708392 Mar 31 '15 at 22:14
  • @user3708392 check the answers below!! – raym0nd Apr 1 '15 at 17:51
2

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');
  • Great Solution, Please can you explain me how in the controller you get the value chosen. I need to get the id of the record chosen. – Enry May 16 '13 at 19:30
  • @Enry Please check my updated answer. – raym0nd May 17 '13 at 13:28
1

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.

0

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>
  • I tried that but my radio buttons were all in one row. – raym0nd Mar 22 '13 at 17:47
  • You may need to use regular HTML and JavaScript then. – Mike Chale Mar 22 '13 at 17:49

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.