JSFiddle - React, Tailwind, and code Playground

by Ashish Kasama

HTML

<table>
      <thead>
        <tr>
        <th class="spacer_100 align_ctr tooltip_trigger">
        Change Status <input type="checkbox" name="sample" onclick="selectAll()">
        </th>
        </tr>
      </thead>
      <tbody>          
          <tr>
          <td class="align_ctr" style="text-align: center">
           <input type="checkbox" name="current_status[]" value="1"/>
          </td>
          </tr>
          <tr>
          <td class="align_ctr" style="text-align: center">
           <input type="checkbox" name="current_status[]" value="1"/>
          </td>
          </tr>
          <tr>
          <td class="align_ctr" style="text-align: center">
           <input type="checkbox" name="current_status[]" value="1"/>
          </td>
          </tr>
          <tr>
          <td class="align_ctr" style="text-align: center">
           <input type="checkbox" name="current_status[]" value="1"/>
          </td>
          </tr>
          
      </tbody>
     </table>

JavaScript

function selectAll() {
      var checkboxes = document.getElementsByTagName("input");
       for(var i=1; i<checkboxes.length;i++) {
        if (checkboxes[i].type == 'checkbox') {
        checkboxes[i].checked = 'true';
       }
      }
     }