jQuery Plugin For Online CSV Data Calculation - csv-calc
| File Size: | 9.56 KB |
|---|---|
| Views Total: | 4406 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
csv-calc is a lightweight jQuery plugin that loads an external CSV file via AJAX and performs the calculation based on the user input.
How to use it:
1. Download and place the jQuery csv-calc plugin's script after you've added jQuery library.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="dist/jquery.csv-calc.js"></script>
2. Assume that you have a CSV file containing 'id', 'product name' and 'price' columns like this:
id name price ABC-001 Product001 800 ABC-002 Product002 1500 ABC-003 Product003 1200 XYZ-001 Product004 2000 XYZ-002 Product005 2800 XYZ-003 Product006 3000
3. Create an empty table to present your CSV data.
<table id="products">
<tr class="th">
<th>id</th>
<th>name</th>
<th>price</th>
<th>amount</th>
<th>sum</th>
</tr>
<tr class="product-info" data-csvcalc-repeat>
<td data-csvcalc-cell="0" data-csvcalc-id></td>
<td data-csvcalc-cell="1"></td>
<td data-csvcalc-cell="2" data-csvcalc-price class="price"></td>
<td><input data-csvcalc-input class="amount" type="number" min="0" value="0"></td>
<td data-csvcalc-sum class="sum">0</td>
</tr>
<tr class="th">
<th colspan="4" class="th-total">total</th>
<td data-csvcalc-total class="total">0</td>
</tr>
</table>
4. Call the plugin on the table and specify the path to your CSV file.
$('#products').csvCalc('products.csv');
5. Possible plugin options.
$('#products').csvCalc('products.csv',{
line_endings: '\n',
ignore_first_line: true,
ignore_last_line: true,
only_integer: true
});
This awesome jQuery plugin is developed by sutara79. For more Advanced Usages, please check the demo page or visit the official website.











