jquery dataTable ajax
dataTable 插件的相关api:http://www.datatables.net/api
最近玩dataTable,ajax,一个sample,留个纪念，备用,下面是对dataTable的初始化,返回结果填充的片段,ajax相关回调和httprequest action等省略...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=utf-8" /><link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/media/images/favicon.ico" /><title>DataTables example</title><style type="text/css" title="currentStyle">@import "../../media/css/demo_page.css";@import "../../media/css/demo_table.css";</style><script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script><script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script><script type="text/javascript" charset="utf-8">$(document).ready(function() {var datatables = null;var datatables = $('#example').dataTable( {'bPaginate': true, "bProcessing": true, 'bLengthChange': true, 'sPaginationType': 'full_numbers',"sAjaxSource": '../ajax/sources/arrays.txt',"oLanguage": { "sProcessing": "正在加载数据...", 'sSearch': '数据筛选:', "sLengthMenu": "每页显示 _MENU_ 项记录", "sZeroRecords": "没有符合项件的数据...", "sInfo": "当前数据为从第 _START_ 到第 _END_ 项数据；总共有 _TOTAL_ 项记录", "sInfoEmpty": "显示 0 至 0 共 0 项", "sInfoFiltered": "(_MAX_)" }, "aoColumns":[ null, { "bSortable": false }, { "bSortable": false }, { "bSortable": false }, { "bSortable": false } ] } ); function updateDataTable() { datatables.fnClearTable();datatables.fnAddData([ ".1","2",".3","4","5"] ); datatables.fnAddData([ ".a","b",".c","d","e"] );} $("#link").click(function(){ updateDataTable(); });} );</script></head><body id="dt_example"><div id="container"> <h1><a href="#" id="link">Live example</a></h1><div id="dynamic"><table cellpadding="0" cellspacing="0" border="0" class="display" id="example"><thead><tr><th width="20%">Rendering engine</th><th width="25%">Browser</th><th width="25%">Platform(s)</th><th width="15%">Engine version</th><th width="15%">CSS grade</th></tr></thead><tbody></tbody><tfoot><tr><th>Rendering engine</th><th>Browser</th><th>Platform(s)</th><th>Engine version</th><th>CSS grade</th></tr></tfoot></table></div><div class="spacer"></div> </body></html>
页:
[1]