Abdullah_hassan
Abdullah_hassan

Reputation: 45

How to calculate sum of selected checkbox value?

i have checkbox with value(value is from database), i want to calculate the total fee and display it at Total Amount(below the table).Total Amount will auto update when user selected or unselect it.

            <LayoutTemplate>
                 <table border="1" cellpadding="4" cellspacing="0" class="table-grid2" width="100%">
                    <tr style="background-color:#CCE1FF;">
                     <thead>
                          <td style="width:1%;" class="line_table_thL"><input type="checkbox" value="" onclick="check_chkItems_toggle(this, 'chkbox');" /></td>
                            <th class="line_table_th" style="width:1%;">No.</th>
                            <th class="line_table_th" style="width:6%;">Waybill No.</th>
                            <th class="line_table_th" style="width:4%;">Service Type</th>
                            <th class="line_table_th" style="width:5%;">Delivered/Received Date</th>
                            <th class="line_table_th" style="width:4%;">Total Fee</th>
                            <th class="line_table_th" style="width:4%;">Postal Status</th>
                            <th class="line_table_th" style="width:4%;">Register By</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr runat="server" id="itemPlaceholder">
                        </tr>
                    </tbody>
             </LayoutTemplate>
                      <ItemTemplate>
                         <td class="line_table_tdL"><input type="checkbox" name="chkbox" value="<%# Eval("postal_id") %>" /></td>
                         <td class="line_table_td"><%# Eval("RowNum") %>&nbsp;</td>
                         <td class="line_table_td"><%# Eval("WAYBILL_NO") %>&nbsp;</td>
                         <td class="line_table_td"><%# Eval("POSTAL_TYPE") %>&nbsp;</td>
                         <td class="line_table_td"><%# Eval("SR_DATE") %>&nbsp;</td>
                         <td class="line_table_td"><%# Eval("TOTAL_FEE") %>&nbsp;</td>
                         <td class="line_table_td"><%# Eval("STATUS") %>&nbsp;</td>
                         <td class="line_table_td"><%# Eval("REG_ID") %>&nbsp;</td>
                     </tr>
                      </ItemTemplate>

 <td>Total Amount : <span id="total"> </span></td>

my jquery :

 function calculate(item) {
             var total = 0;
             if (item.checked) {
                 total += parseInt(item.TOTAL_FEE);
             } else {
                 total -= parseInt(item.TOTAL_FEE);
             }
             //alert(total);
             document.getElementById('Totalcost').innerHTML = total + " /-";
         }

Upvotes: 1

Views: 1301

Answers (1)

Milind Anantwar
Milind Anantwar

Reputation: 82241

You can use:

 $('.table-grid2 input').change(function(){
     var total = 0;
     $('.table-grid2 input').each(function() {
         if (this.checked)
         {
              total += parseInt(this.value);
         }
     });
     $('#total').html(total);
 });

Upvotes: 2

Related Questions