Press "Enter" to skip to content

jQuery Plugin For Adding Quick Indicator Bars To Tabular Data

tableMeter is a jQuery plugin that helps you display custom Excel-like data bars to visualize integers in a range of table cells. It can also be implemented on stand-alone items to serve as a progress indicator.

how to display data in datatable using jquery, jquery datatable render get row data, datatables render data from another column, datatables render get row data

Dynamic CRUD table Data Grid Input JavaScript Plugin | appendGrid

How to make use of it:

1. Include the jQuery library and jQuery tableMeter plugin on your web page.

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="jquery.tableMeter.js"> </script>

2. Call the plugin in the table cells to display data bars based on values.

$('.data-cell').tableMeter({ 

  // Options here

});

3. Plugin options and defaults.

$('.data-cell').tableMeter({ 

'meterMax'            : 1.0,
'meterWidth'          : 50,
'meterHeight'         : 15,
'meterContainerBorder': 1,
'meterFillColor'      : '#999999',
'meterEmptyColor'     : '#ECECEC',
'meterContainerClass' : 'meter-container',
'meterBarClass'       : 'meter-bar'

});

Render Data Bar From Tabular Data, jquery-tableMeter Plugin/Github, jquery datatable render function parameters, column render datatables example, datatables render row index, datatables render example


See Demo And Download

Official Website(stephenyeargin): Click Here

This superior jQuery/javascript plugin is developed by stephenyeargin. For extra advanced usage, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published. Required fields are marked *