Tiny jQuery Plugin For Creating An Editable Table - editTable
File Size: | 7.7 KB |
---|---|
Views Total: | 12747 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
A basic jQuery implementation of editable table that help you edit your individual table cells in place.
How to use it:
1. Include jQuery library and jQuery editTable plugin's Javascript and CSS in the page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.edittable.min.js"></script> <link rel="stylesheet" href="css/jquery.edittable.min.css">
2. Create an empty element that will be served as a data table container.
<div id="edittable"></div>
3. Call the plugin on the container elements and create the initial data for the table using Javascript array object.
<script> $("#edittable").editTable({ data: [ ['Ali', 'Programmer', 'Python, C++'], ['Yazen', 'Programmer', 'Python, C++'] ], headerCols: [ 'Employee', 'Title', 'Stack' ], }); </script>
4. Default options.
<script> $("#edittable").editTable({ name: '', data: [['']], jsonData: false, headerCols: false, maxRows: 999 }); </script>
This awesome jQuery plugin is developed by maliaijaz. For more Advanced Usages, please check the demo page or visit the official website.