Question

I’ve got a javascript snippet that loops through all inputs (all rows in a table) and if one checkbox is checked in a single row, it checks all checkboxes in all rows.

I actually need it to check a 2nd checkbox in the same row not all rows so I need to edit the javascript snippet, where it increments

//loop through all inputs
            for(i = 0; i < inputs.length; i++) 

---

<script type="text/javascript">
var mainchecked = false;  

    function checkAll() {

        //get all input elements
        var inputs = document.getElementsByTagName('input');

        //if the box is being checked
        if(!mainchecked) {

            //loop through all inputs
            for(i = 0; i < inputs.length; i++) {
                //does it have autocheck?
                if(inputs[i].className == 'autocheck') {
                    //then check the box!
                    inputs[i].checked = "checked";  
                }
            }
            mainchecked = true;
        } else {
            //box is being unchecked, uncheck everything
            for(i = 0; i < inputs.length; i++) {
                inputs[i].checked = "";
            }
            mainchecked = false;
        }
    }
</script>

Answer 1

Don’t loop through all inputs, loop through the table rows and process the inputs within each row. The following code assumes the controlling checkbox for the row is in the first input found within the row and that all other checkboxes in the row that this functionality applies to will have the class set to “autocheck”; I’ll leave it to you to modify this as needed for your specific case (e.g., you might need to check whether type=="checkbox").

I haven’t tested this, but it should give you enough to go on.

function checkAll(){
   var _rows = document.getElementById("yourTableID").rows;
   var i,
       j,
       isChecked,
       inputs;

   for (i=0; i < _rows.length; i++) {
      inputs = _rows[i].getElementsByTagName("input");
      isChecked = inputs[0].checked;
      for (j=1; j < inputs.length; j++) {
         if (inputs[j].className == "autocheck") {
            inputs[j].checked = isChecked;
         }
      }
   }

}

UPDATE: just saw in your comments that you seem to be triggering this functionality from the onclick of the controlling checkboxes. If that is so then you can pass a reference to that checkbox to your function and then process only the row it is in, as follows:

<input ... onclick="checkAll(this);" ...>

function checkAll(cb){
       var _row = cb.parentNode.parentNode,
           j,
           isChecked = cb.checked,
           inputs;

          inputs = _row.getElementsByTagName("input");
          for (j=0; j < inputs.length; j++) {
             if (inputs[j].className == "autocheck") {
                inputs[j].checked = isChecked;
             }
          }
    }

Google “mdc parentnode” for more info.