Count the number of checkbox and amount in table

I’m having a trouble on how can I count total check in table checkbox and total all amount on amount column based of what been checked in checkbox field.I’m new in javascript and html. It would be great if anyone can help me with this problem, thanks in advance!

function toggle(source) {
  checkboxes = document.getElementsByName('product_id[]');
  for(var i=0, n=checkboxes.length;i<n;i++) {
  checkboxes[i].checked = source.checked;
 }
 }
<table class="table" name="table" id="table">
        <thead>
          <tr >
          <th></th>
          <th ><input type="checkbox" onClick="toggle(this)" /></th>
          <th>Name</th>
          <th>Amount</th>
          </tr>
        </thead>
        <tbody >
          <tr>
            <td></td>
            <td><input type="checkbox" name="product_id[]"></td>
            <td>Jessica</td>
            <td>5200</td>
          </tr>

          <tr>
            <td></td>
            <td><input type="checkbox" name="product_id[]" ></td>
            <td>Jessica</td>
            <td>800</td>
          </tr>            
        </tbody>
    </table>
          Number of checkbox = <p id="total_checked"></p>
          Totol amount = <p id="total_amount"></p>

I guess using onChange this is possible.
The number of checkbox should total depends on what fields check in checkbox
and the amount should total based on amount column and fields that check in checkbox. It is possible?

16 thoughts on “Count the number of checkbox and amount in table”

Leave a Comment