1

I am trying to create Radio Button using <apex:repeat> and in {!recordList} i have 7 records so it will create 7 Radio Buttons. But the problem is that all 7 Buttons are getting Selected and i want only one at a time. Someone told me that you can use <apex:repeat> after <apex:selectRadio so radio list will be one 1 and have 7 options but in that case what will be the value of <apex:selectRadio>because i need this Id to perform some functioning

VF Page

<apex:repeat value="{!recordList}" var="rep">
    <apex:selectRadio id="isRadio" value="{!rep.isSelected}">
        <apex:selectOptions value="{!items}" />
    </apex:selectRadio>
</apex:repeat>

Controller

public List<SelectOption> getItems() {
        List<SelectOption> options = new List<SelectOption>();
        options.add(new SelectOption('true',''));
        return options;
    }
1

Each apex:radioGroup is a unique record group. You can select all of them because they separate radio groups. In other words, you're expecting code like the following:

<input type="radio" name="group1" />
<input type="radio" name="group1" />
...

But what you're really getting is:

<input type="radio" name="group1" />
<input type="radio" name="group2" />
...

This allows all of them to be selected.


If you need just one group, you need to use some JavaScript. That said, the JS you need is only used to associate the inputs to a bound input value:

    <script>
    function updateHidden(event) {
        document.querySelector("[id$=selectedValue]").value = event.target.value;
        console.log(event.target.value);
    }
    </script>
    <apex:inputHidden value="{!selectedValue}" id="selectedValue" />
    <apex:repeat value="{!recordList}" var="rep">
        <input name="isRadio" type="radio" onchange="updateHidden(event)" value="{!rep.value}" label="{!rep.value}" />
    </apex:repeat>

</apex:form>

This should give you the functionality you need with various non-standard layouts.

  • 1
    Here in <apex:inputHidden value="{!selectedValue}" what is selectedValue. Where it is defined as i can not directly access this in VF – SFDC_M Aug 14 at 14:33
  • @ManishKumar Specify the variable in the controller. – sfdcfox Aug 14 at 14:42
1

Use Input Tag for Radio Button as shown below

<td>
  <input name="isRadio" type="radio" value="{!rep.Id}" /><br/>
</td>

Click here to see Implementation of Radio Button

-1

You can create a javascript function to make sure only one radio button is selected at a time. This works for checkboxes, I haven't tried it with radio buttons

function deselectOtherBoxes(selectedBox){

        if(selectedBox.checked){

            var allBoxes = document.getElementsByClassName('myclass');

            for (let i = 0; i < allBoxes.length; i++) {

                if (allBoxes[i].checked) {
                    allBoxes[i].checked = false;
                }        
            }
            selectedBox.checked = true;
        }
    }

Then you can call it this way

<apex:column >
    <apex:facet name="header">Select</apex:facet>
     <apex:inputCheckbox value="{!con.selected}" onchange="deselectOtherBoxes(this)"/>
 </apex:column>
  • Thanks @CommomCoreTawan but, it will not work because the problem is here that i am using <apex:repeat> and this is creating multiple <apex:selectRadio> elements each with a single <apex:selectOption/> element, which is basically creating multiple groups of one radio button. – SFDC_M Aug 14 at 14:00

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.