how to join two table in codeigniter easily[updated] | ci_model | ci_controller | codeigniter 3 -datainflow
How to use datatable and add row to it using jquery:
Now a days table are using very much in web application,To get the different kind of features we have to use datatable. DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, based upon the foundations of progressive enhancement, and will add advanced interaction controls to any HTML table.So before using datatable we have add the jquery library and datatable jquery library and its css.
CSS
//cdn.datatables.net/1.9.4/css/jquery.dataTables.css
JS
//cdn.datatables.net/1.9.4/js/jquery.dataTables.min.js
First create a simple table with id example
<table id="example_table" cellspacing="0" width="100%"> <thead> <tr> <th>Id</th> <th>First Name</th> <th>Last Name</th> <th>Salary</th> <th width="12%">Performance Grade</th> </tr> </thead> <tbody> <tr> <td>23</td> <td>Aditi</td> <td>Patel</td> <td >23,000</td> <td>A</td> </tr> <tr > <td>22</td> <td>Ria</td> <td>Chowdhury</td> <td>23,980</td> <td>A</td> </tr> <tr> <td>64</td> <td>Pooja</td> <td>Desai</td> <td>24,000</td> <td>A</td> </tr> <tr> <td>41</td> <td>Twinkle</td> <td>Patel</td> <td>18,000</td> <td>C</td> </tr> <tr> <td>32</td> <td>Rutvi</td> <td>Palor</td> <td>23,660</td> <td>A</td> </tr> <tr> <td>28</td> <td>Maulik</td> <td>Patel</td> <td>20,000</td> <td>B</td> </tr> </tbody> </table>
After that initialize the datatable.
<script type="text/javascript"> $(document).ready(function () { $("#example_table").dataTable({ "scrollY":"100px", "bScrollCollapse": true, "bPaginate": true, "sPaginationType": "full_numbers", "bJQueryUI": true, "aLengthMenu": [[3, 5, 10, -1], [3, 5, 10, "All"]], "iDisplayLength": 3 }); }); </script>
Now add data to datatable using jquery
<script type="text/javascript"> var counter=1; function fnClickAddRow() { $('#example_table').dataTable().fnAddData( [ "20", "Alice", "Paul", "40,000", "A"] ); counter++; } </script>
That’s all
Related posts