0

I have a data in a row along with 3 checkboxes. I need to toggle between 3 checkboxes in each row.

<apex:repeat value="{!ManagerNameList}" var="m" >

    <tr id="trRow">

        <td>{!m.role}<br /> {!m.name}<br />{!m.email} </td>
        <td style="text-align:center;" id='TO'><input type="checkbox" onclick="toggleCheckbox()"/></td>
        <td style="text-align:center;" id='CC'><input type="checkbox" onclick="toggleCheckbox()"/></td>
        <td style="text-align:center;" id='BCC'><input type="checkbox" onclick="toggleCheckbox()"/></td>

    </tr>
</apex:repeat>

Javascript Function :


function toggleCheckbox() {

  var inputs = document.getElementsByTagName("input");
  for(var i = 0; i < inputs.length; i++) {
    if(inputs[i].type == "checkbox") { 
      if(inputs[i].checked == false) {
        inputs[i].checked = true; 
      } else {
        if(inputs[i].checked == true) {
          inputs[i].checked = false; 
        }   
      }
    }
  }
} 

5

If you want only one checkbox, then I don't think you should be using checkbox. You should be using radio - button. Checkbox simply implies you can select multiples.

<!DOCTYPE html>
<html>
<body>

<form action="">
  <input type="radio" name="gender" value="male"> Male<br>
  <input type="radio" name="gender" value="female"> Female<br>
  <input type="radio" name="gender" value="other"> Other
</form>

<p><b>Note:</b> When a user clicks on a radio-button, it becomes checked, and all other radio-buttons with equal name become unchecked.</p>

</body>
</html>
  • 1
    Just to expand on this answer the thing that makes the radio buttons grouped is the fact that they all have the same name. Make sure this is how you implement it to achieve what you want. – Zack Walton Feb 7 at 20:14
  • @pranay - My requirement would be toggling between checkboxes/radio button in the same row(td) . e.g if user clicks To and then goes to click CC , To should get unchecked. – SFDCRookie Feb 8 at 2:03
  • @sfdcrookie, try adding an index variable and give it into the name field of the checkbox which may do the trick. – Soul_In_Code Feb 8 at 2:18

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.