How to bind Radio button on pageblocktable or datatable in visualforce page

This article will help you to bind radio button selection in PageBlockTable or DataTable in visualforce page.

The below code will do the following functionalities,

1. Displayed Account records in Page block table with Radio Button option.

2.You can choose only one account at a time by selecting a radio button.

3. After account record is selected click on "View Contact Records" button. This will display the list contact records related to the selected account.

Apex Class:

1. public class RadioButtonController
2. {
3.     public string selectedAccountId{get; set;}
4.     public List<Account> accounts{get; set;}
5.     public List<Contact> contacts{get; set;}
6.    
7.     public RadioButtonController()
8.     {
9.         accounts = [SELECT Name, Type FROM Account LIMIT 10];
10.     }
11.     public PageReference getSelected()
12.     {
13.         System.debug('Entered account selection block');
14.         selectedAccountId = ApexPages.currentPage().getParameters().get('accid');
15.         contacts = new List<Contact>();
16.         return null;
17.     }
18.     public void viewContacts()
19.     {  
20.         if(selectedAccountId != null)
21.         {
22.             contacts = [SELECT FirstName, LastName FROM Contact WHERE AccountId =:selectedAccountId];
23.             if(contacts.size() == 0)
24.             contacts = null;
25.         }
26.     }
27. }

Visualforce Page:

1. <apex:page controller="RadioButtonController">
2.     <apex:form>
3.         <!-- Account page block -->
4.         <apex:pageBlock title="Account Viewer" >
5.             <apex:pageblockSection rendered="{!If(accounts !=null && accounts.size>0,true,false)}">
6.                 <apex:pageBlockTable value="{!accounts}" var="acc"  width="100%" id="accTable">
7.                     <apex:column headerValue="Select">
8.                         <input type="radio" name="<strong>selectRadio</strong>" id= "radio">
9.                         <br/>
10.                         <apex:actionSupport event="onclick" action="{!getSelected}" status="buttonStatus"  reRender="cntblock">
11.                             <apex:param name="accid" value="{!acc.id}"/>
12.                         </apex:actionSupport>
13.                     </input>
14.                 </apex:column>
15.                 <apex:column value="{!acc.Name}"/>
16.                 <apex:column value="{!acc.Type}"/>
17.             </apex:pageBlockTable>
18.         </apex:pageBlockSection>
19.        
20.         <!-- Action status block -->
21.         <apex:actionStatus id="buttonStatus">
22.             <apex:facet name="start">
23.                 <apex:outputPanel >
24.                     <apex:commandButton value="View Contact Records" disabled="true"/>
25.                 </apex:outputPanel>
26.             </apex:facet>
27.             <apex:facet name="stop">
28.                 <apex:outputPanel >
29.                     <apex:commandButton value="View Contact Records" action="{!viewContacts}" reRender="cntblock"/>
30.                 </apex:outputPanel>
31.             </apex:facet>
32.         </apex:actionStatus>
33.     </apex:pageBlock>
34.    
35.     <!-- Contact Block -->
36.     <apex:outputPanel id="cntblock">
37.         <apex:pageBlock title="Available Contacts" rendered="{!If(contacts != null && contacts.size>0,true,false)}">
38.             <apex:pageblockSection>
39.                 <apex:pageBlockTable value="{!contacts}" var="con"  width="100%" id="cntTable">
40.                     <apex:column value="{!con.FirstName}"/>
41.                     <apex:column value="{!con.LastName}"/>
42.                 </apex:pageBlockTable>
43.             </apex:pageblockSection>
44.         </apex:pageBlock>
45.         <apex:pageMessage summary="No Contacts Found" severity="Info" strength="3" rendered="{!AND(contacts == null, selectedAccountId != null)}"/>
46.     </apex:outputPanel>
47. </apex:form>
48.  
49. </apex:page>

Sample Snap:

Snap 1:

Snap 2: