Dynamic count of checkboxes in a table

Course Of The Month

11 days, 6 hours left to enroll

View July's Free Course

Become a Premium Member and unlock a new, free course in leading technologies each month.

I have a table that display a jquery checkbox at the end of every row. I would like to display the total number of checkboxes that are checked in the last row of the table. Here is the table:

<table border="1">
                <tr>
	                <th></th>
                    <th style="vertical-align:middle;">Number</th>
                    <th style="text-align:left; vertical-align:middle;">Owner</th>
                    <th style="text-align:left; vertical-align:middle;">Address</th>
                    <th style="vertical-align:middle;">Code</th>
                    <th style="vertical-align:middle;">Class</th>
                    <th style="vertical-align:middle;">Filing Fee</th>
                    <th style="text-align:center; width:70px;">Review ?<br /><span style="text-decoration:underline; cursor:pointer;" onclick="select_all_com()">All</span> &nbsp;&nbsp;&nbsp;
					<span style="text-decoration:underline; cursor:pointer;" onclick="select_none_com()">None</span></th>
                </tr>

                <?php foreach ($property['commercial'] as $key => $value): ?>
                    <tr>
                    	<th><?php echo str_pad($row++, 2, '0', STR_PAD_LEFT); ?></th>
                        <td><a href= "<?php echo site_url() . "propertydetail/viewpropertydetail/" . $value['property#']; ?>"><?php echo Roll($value['property#']); ?></a></td>
                        <td style="text-align:left"><?php echo $value['Property Owner']; ?> </td>
                        <td style="text-align:left"><?php echo $value['Property Address']; ?></td>
                        <td style="text-align:middle" ><?php echo number_format($value['PC'],0); ?></td>
						<td><?php echo $value['Class']; ?></td>
                        <td><?php echo money_format('$%.0i', 140); ?></td>
                        <td id="com" style="padding-left:23px;">
                        	<input type="checkbox" name="file_com_appeal" class="com-checkbox" value="<?php echo $value['property#'] ?>">                            
                        </td>                                            
                    </tr>
                <?php endforeach; ?>
                    <th colspan="6" style="text-align:right; padding:1% 3% 1% 0%;"><h4>Total</h4></th>
                    <th><?php echo "NEED COUNT OF THE CHECKED CHECKBOXES HERE"; ?></th>
                    <th></th>
            </table>

Open in new window

Could someone please help me to understand how to keep track of the number of checkboxes that are checked? By the way, this needs to update itself with each checkbox that is changed.

Thank you.

One of the attributes of a checkbox is checked which is boolean. A count of the number that are true will always yield the count. If you establish the count at load time, then just capture the click event that occurs whenever a checkbox is checked or unchecked. Then al you have to to is test the state and add or subtract one from the total. The total cell can contain a simple text input and you just update the value attribute from the javascript variable where you are keeping the count.

Don't try and do arithmetic with the input value because it is a string.

Cd&

In addition to COBOdinosaur's solution here a code snippet on how to do it:

$(function(){
    var total = 0;
    $('input[type=checkbox]').live('mouseup', function(){
        if ($(this).attr('checked') == true) {
             total++;
        } else {
             total--;
        }
      $('input[name=totalcheckboxes]').val(total);
   });
});

Open in new window

This is checking for a mouseup event on checkbox and then looks if checked is true or false. On true it adds one to total, if false it subtracts one on total and then it show the value in a text input with the name totalcheckboxes.

Thanks for the tips. Very helpful.

The Percona Live Open Source Database Conference Europe 2017 is the premier event for the diverse and active European open source database community, as well as businesses that develop and use open source database software.

Course Of The Month

Dynamic count of checkboxes in a table

Welcome to Experts Exchange

Featured Post

Suggested Courses

632 members asked questions and received personalized solutions in the past 7 days.

Enjoyed your answer?

Keep in touch with Experts Exchange

Live Consultants