jquery dataTable ajax
rujinshi 2011-09-16
dataTable插件的相关api:
http://www.datatables.net/api
最近玩dataTable,ajax,一个sample,留个纪念，备用,下面是对dataTable的初始化,返回结果填充的片段,ajax相关回调和httprequestaction等省略...
<!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> 
相关推荐
kentrl 0喜欢 / 0评论 2020-11-10
结束数据方法的参数，该如何定义？-- 集合为自定义实体类中的结合属性，有几个实体类，改变下标就行了。<input id="add" type="button" value="新增visitor&quo
ajaxyan 0喜欢 / 0评论 2020-11-09
zndy0 0喜欢 / 0评论 2020-11-03
学留痕 0喜欢 / 0评论 2020-09-20
Richardxx 0喜欢 / 0评论 2020-11-09
learningever 0喜欢 / 0评论 2020-09-19
chongxiaocheng 0喜欢 / 0评论 2020-08-16
ajaxhe 0喜欢 / 0评论 2020-08-16
lyqdanang 0喜欢 / 0评论 2020-08-16
curiousL 0喜欢 / 0评论 2020-08-03
TONIYH 0喜欢 / 0评论 2020-07-22
时光如瑾雨微凉 0喜欢 / 0评论 2020-07-19
83510998 0喜欢 / 0评论 2020-07-18
坚持着执着 0喜欢 / 0评论 2020-07-16
jiaguoquan00 0喜欢 / 0评论 2020-07-07
李永毅 0喜欢 / 0评论 2020-07-05
坚持着执着 0喜欢 / 0评论 2020-07-05
wcqwcq 0喜欢 / 0评论 2020-07-04
Chaunceywu 0喜欢 / 0评论 2020-06-27
wcqwcq 0喜欢 / 0评论 2020-06-26
李永毅 0喜欢 / 0评论 2020-06-21
坚持着执着 0喜欢 / 0评论 2020-06-16
delmarks 0喜欢 / 0评论 2020-06-14
wcqwcq 0喜欢 / 0评论 2020-06-14
坚持着执着 0喜欢 / 0评论 2020-06-14
ppsurcao 0喜欢 / 0评论 2020-06-14
wujiajax 0喜欢 / 0评论 2020-06-14
本文实例讲述了php+ ajax 实现的写入数据库操作。分享给大家供大家参考，具体如下：。<input class="tel" type="text" placeholder="请输入您的手机号码&q
carpenterworm 0喜欢 / 0评论 2020-06-13
84423067 0喜欢 / 0评论 2020-06-12
TONIYH 0喜欢 / 0评论 2020-06-11
ajaxtony 0喜欢 / 0评论 2020-06-11
Richardxx 0喜欢 / 0评论 2020-06-10
春雨的雕刻时光 0喜欢 / 0评论 2020-06-10
坚持着执着 0喜欢 / 0评论 2020-06-10
TONIYH 0喜欢 / 0评论 2020-06-08
ChinaGuanq 0喜欢 / 0评论 2020-06-08
tthappyer 0喜欢 / 0评论 2020-06-07
坚持着执着 0喜欢 / 0评论 2020-06-07
Chydar 0喜欢 / 0评论 2020-06-07
风萧萧梦潇 0喜欢 / 0评论 2020-06-06
88570299 0喜欢 / 0评论 2020-06-05
坚持着执着 0喜欢 / 0评论 2020-06-05
TONIYH 0喜欢 / 0评论 2020-06-05
李永毅 0喜欢 / 0评论 2020-06-04
水痕 0喜欢 / 0评论 2020-06-03