- 论坛徽章:
- 30
|
直接上代码- web(_Env,[])->
- [header(),
- "<HTML>
- <HEAD>
- <link href='/css/jquery.dataTables.css' rel='stylesheet' >
- <script type='text/javascript' src='/js/jquery.js'></script>
- <script type='text/javascript' src='/js/jquery.dataTables.js'></script>
- </HEAD>
- <BODY>\n",
- "
- <script>
- $(document).ready(function(){
- $('#console').dataTable( {
- 'processing': true,
- 'serverSide': false,
- 'ajax': '/cgi-bin/erl/web/get_data_from_db'
- } );
- $('#console tfoot th').each( function () {
- var title = $('#console tfoot th').eq( $(this).index() ).text();
- $(this).html( '<input type=\"text\" placeholder=\"Search '+title+'\" />' );
- } );
-
- // DataTable
- var table = $('#console').DataTable();
-
- // Apply the search
- table.columns().eq( 0 ).each( function ( colIdx ) {
- $( 'input', table.column( colIdx ).footer() ).on( 'keyup change', function () {
- table
- .column( colIdx )
- .search( this.value )
- .draw();
- } );
- } );
- } );
- </script>
- ",
- % you need match the db column to the table column amount
- "<table id='console' class='display' cellspacing='0' width='100%'><tr>
- <thead><tr><th>NAME</th><th>IP</th><th>DATE</th></tr></thead>
- <tfoot><tr><th>NAME</th><th>IP</th><th>DATE</th></tr></tfoot>
- <tbody>
- </table>",
- footer()].
复制代码 |
|