+ Start a Discussion
wixxeywixxey 

Selecting only one row in datatable using checkbox

I have been using a datatable along with a checkbox in each row, I want that the user shod not select more then one row. i want to use these checkboxes as radiobox, i want to keep the multiple selection off.. my code is

 

<apex:pageBlockTable value="{!results}" var="assessments">
                    <apex:column >
                        <apex:inputCheckbox value="{!assessments.selected}" id="selectLine1"/> 
                    </apex:column> 
                    <apex:column headervalue="Devices">
                   
                        <apex:outputtext value="{!assessments.as.Device__c}" />
                    </apex:column>
                    <apex:column headervalue="Manufacturer">
                        <apex:outputtext value="{!assessments.as.Manufacturer__c}"/>
                    </apex:column>
                    <apex:column headervalue="Test Name">
                        <apex:outputtext value="{!assessments.as.Test_Name__c}"/>
                    </apex:column>
                    <apex:column headervalue="Analyte">
                        <apex:outputtext value="{!assessments.as.Analyte__c}"/>
                    </apex:column>
                   <apex:column headervalue="Price in $">
                        <apex:outputtext value="{!assessments.as.Price__c}"/>
                    </apex:column>
                   
      </apex:pageBlockTable> 

 Kindly guide me whether this is possible

Best Answer chosen by Admin (Salesforce Developers) 
wixxeywixxey

I have finally solved that matter by adding some jquery into my code

 

<apex:pageBlockTable value="{!results}" var="assessments">
                    <apex:column >
                     <!--    <apex:facet name="header">
                             <apex:inputCheckbox onclick="checkAll(this)"/>
                         </apex:facet>  -->
                        
                        <apex:inputCheckbox value="{!assessments.selected}" id="selectLine1"/> 
                        <apex:includeScript value='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'  />
                        <script type="text/javascript">
                                jQuery.noConflict();
                                jQuery(document).ready(function(){
                                    jQuery('input[type=checkbox]').change(function(){
                                        if(jQuery(this).is(':checked')){
                                            jQuery('input[type=checkbox]').attr('disabled',true);
                                            jQuery(this).attr('disabled','');
                                        }
                                        else{
                                                jQuery('input[type=checkbox]').attr('disabled','');
                                        }
                                        console.log('Changed');
                                    });
                                   
                                });
                        </script> 
                        
                    </apex:column> 
                    <apex:column headervalue="Devices">
                   
                        <apex:outputtext value="{!assessments.ass.Device__c}" />
                    </apex:column>
                    <apex:column headervalue="Manufacturer">
                        <apex:outputtext value="{!assessments.ass.Manufacturer__c}"/>
                    </apex:column>
                    <apex:column headervalue="Test Name">
                        <apex:outputtext value="{!assessments.ass.Test_Name__c}"/>
                    </apex:column>
                    <apex:column headervalue="Analyte">
                        <apex:outputtext value="{!assessments.ass.Analyte__c}"/>
                    </apex:column>
                   <apex:column headervalue="Price in $">
                        <apex:outputtext value="{!assessments.ass.Price__c}"/>
                    </apex:column>
                   
                </apex:pageBlockTable>  

All Answers

harsha__charsha__c

I think this can be achieved in the following method:

 

Onclick of any of the checkbox, Disable all other checkboxes, by javascript.

 

There is an attribute named "disabled" for <apex:inputcheckbox/>

 

 

Please let me know if you see success with this and also let me know the failures in case of any

kiranmutturukiranmutturu
this code is some what helpful to you...but not the best part of doing the same.. as this code contains some assumptions like the id of the checkbox component is in the format like "j_id0:frm:j_id2:j_id3:4:selectLine1".....if your inputcheckbox is inside the page,form,pageblock and pageblocktable this code will work....if you have any other subsections you need to change the spit code in the javascript



<apex:page standardController="account" recordSetVar="acts">

&lt;script&gt;
function blow(cbid,bln){
var x = cbid;

var x1 = x.split(':');

var firstpart = x1[0]+":"+x1[1]+":"+x1[2]+":"+x1[3]+":";
var secondpart = ":"+x1[5];
var mys = "{!acts}";
mys = mys.split(',');

for(var i =0; i< mys.length;i++){
if(x1[4] != i){

document.getElementById(firstpart+i+secondpart).disabled = true;

}
if(bln == false)
document.getElementById(firstpart+i+secondpart).disabled = false;

}



}


&lt;/script&gt;




<apex:form id="frm">
<apex:pageBlock>
<apex:pageBlockTable value="{!acts}" var="a">
<apex:column >
<apex:inputCheckbox value="{!a.active__c}" onchange="blow(this.id,this.checked)" id="selectLine1"/>
</apex:column>
<apex:column value="{!a.name}" />

</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>


</apex:page>

basically this is a kind of reference for you to implement according to your scenario
wixxeywixxey

I have finally solved that matter by adding some jquery into my code

 

<apex:pageBlockTable value="{!results}" var="assessments">
                    <apex:column >
                     <!--    <apex:facet name="header">
                             <apex:inputCheckbox onclick="checkAll(this)"/>
                         </apex:facet>  -->
                        
                        <apex:inputCheckbox value="{!assessments.selected}" id="selectLine1"/> 
                        <apex:includeScript value='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'  />
                        <script type="text/javascript">
                                jQuery.noConflict();
                                jQuery(document).ready(function(){
                                    jQuery('input[type=checkbox]').change(function(){
                                        if(jQuery(this).is(':checked')){
                                            jQuery('input[type=checkbox]').attr('disabled',true);
                                            jQuery(this).attr('disabled','');
                                        }
                                        else{
                                                jQuery('input[type=checkbox]').attr('disabled','');
                                        }
                                        console.log('Changed');
                                    });
                                   
                                });
                        </script> 
                        
                    </apex:column> 
                    <apex:column headervalue="Devices">
                   
                        <apex:outputtext value="{!assessments.ass.Device__c}" />
                    </apex:column>
                    <apex:column headervalue="Manufacturer">
                        <apex:outputtext value="{!assessments.ass.Manufacturer__c}"/>
                    </apex:column>
                    <apex:column headervalue="Test Name">
                        <apex:outputtext value="{!assessments.ass.Test_Name__c}"/>
                    </apex:column>
                    <apex:column headervalue="Analyte">
                        <apex:outputtext value="{!assessments.ass.Analyte__c}"/>
                    </apex:column>
                   <apex:column headervalue="Price in $">
                        <apex:outputtext value="{!assessments.ass.Price__c}"/>
                    </apex:column>
                   
                </apex:pageBlockTable>  
This was selected as the best answer
Jeff MikkelsonJeff Mikkelson
This is simple, it works, and you can use it with multple checkbox series to unselect all checkbox in the series except the one you checked.  The onclick event passes the checked instance to the unCheckOther Javascript function.  unCheckOther will uncheck all checkboxes in the named series, which in this case is "checkedone".  Finally, the function will turn on the checkbox that should be seleted; cb.checked.  This also gives you the ability to ping your controller from the click event with the actionSupport event.
       
            <apex:column >
                        <apex:inputCheckbox value="{!a.selected}" id="checkedone" onclick="unCheckOther(this)">
                            <apex:actionSupport event="onclick" action="{!getSelectedEmails}"/>
                        </apex:inputCheckbox>
                    </apex:column> 

    <script type="text/javascript">
        function unCheckOther(cb)
            {
                var inputElem = document.getElementsByTagName("input");                    
                for(var i=0; i<inputElem.length; i++)
                {            
                    if(inputElem[i].id.indexOf('checkedone') != -1)
                        if (inputElem[i].checked = true)
                            inputElem[i].checked = false;
                }
                cb.checked = true;
            }
    </script>