Sum Total of Row and Column In Table - jQuery tableTotal
File Size: | 5.14 KB |
---|---|
Views Total: | 35166 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Yet another jQuery table data calculation plugin that allows to calculate column and row sum in your html table.
How to use it:
1. Download and then include the JavaScript file 'jquery.tableTotal.js' after you've included jQuery JavaScript library.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="jquery.tableTotal.js"></script>
2. Just call the function on the html table and the plugin will take care of the rest.
<table id="totalMe" class="table table-bordered"> <thead> <tr> <th></th> <th>Q1</th> <th>Q2</th> <th>Q3</th> <th>Q4</th> </tr> </thead> <tbody> <tr> <th>North</th> <td>54</td> <td>14</td> <td>91</td> <td>16</td> </tr> <tr> <th>East</th> <td>40</td> <td>7</td> <td>75</td> <td>87</td> </tr> <tr> <th>South</th> <td>24</td> <td>39</td> <td>88</td> <td>89</td> </tr> <tr> <th>West</th> <td>32</td> <td>89</td> <td>69</td> <td>75</td> </tr> </tbody> </table>
$('#totalMe').tableTotal();
3. Enabled/disable total row/column.
$('#totalMe').tableTotal({ totalRow: true, totalCol: true, });
4. Set the font-weight of total numbers to 'bold'.
$('#totalMe').tableTotal({ bold: true });
This awesome jQuery plugin is developed by travishorn. For more Advanced Usages, please check the demo page or visit the official website.