jquery datatables 简单应用

function search() {
		table = $('#table')
				.dataTable(
						{
							searching : false,
							bLengthChange : false,
							paging : true,
							ordering : false,
							bFilter : true,
							info : true,
							bDestroy : true,
							iDisplayLength : 20,
							sPaginationType : "full_numbers",
							oLanguage : {
								sLengthMenu : "每页显示 _MENU_ 条记录",
								sZeroRecords : "抱歉, 没有找到",
								sInfo : "从 _START_ 到 _END_ /共 _TOTAL_ 条数据",
								sInfoEmpty : "没有数据",
								sProcessing : "正在加载数据...",
								sInfoFiltered : "(从 _MAX_ 条数据中检索)",
								sZeroRecords : "没有检索到数据",
								sSearch : "名称:",
								oPaginate : {
									sFirst : "首页",
									sPrevious : "前一页",
									sNext : "后一页",
									sLast : "尾页"
								}
							},
							/* iDisplayStart : function(){
								var start = parseInt($("page"));
								return start;
								
							}, */
							bProcessing : false,
							bServerSide : true,
							sAjaxSource : "acLogAction!findLogList",
							fnServerData : function(sSource, aoData, fnCallback) {
								aoData.push({
									"msn" : $("#p_msn").val(),
									"log_no" : $("#log_no").val(),
									"log_date" : $("#log_date").val(),
									"log_date2" : $("#log_date2").val()

								});

								$.ajax({
									type : 'post',
									url : sSource,
									dataType : "json",
									data : {
										aoData : JSON.stringify(aoData)
									},
									success : function(resp) {
										fnCallback(resp);
										 $("[name='dis']").parent().hide();
									}
								});
							},
							columns : [ {
								data : "ITEM1", //要与后台传来的字段对应
								name : "ITEM1"  //表格表头
							}, {
								data : "ITEM2",
								name : "ITEM2"
							}, {
								data : "ITEM3",
								name : "ITEM4"
							}, {
								data : "ITEM4",
								name : "ITEM4"
							}, {
								data : "ID",
								name : "id"
							} ],
							columnDefs : [
									{   //隐藏列
										targets : [ 4 ],
										mRender : function(data, type, full) {
											return "<input name='dis' hidden=true value='"+data+"'></input>"
										}
									},
									{   //加链接
										targets : [ 1 ],
										mRender : function(data, type, full) {
											return "<a href='acLogAction!addLogLegJsp?log_id="+full.LOG_ID+"&log_no="+full.LOG_NO+"&log_date="+full.LOG_DATE+"&msn="+data+"'>"+data+"</a>"
										}
									} ],

						});
		
	}


后端需返回给前端的数据,参数名必须是这些
 map.put("aaData", "查询数据的LIST");  //必须为 aaData,显示在表格的数据
		map.put("iTotalRecords","总条数");  //必填项
		map.put("iTotalDisplayRecords","总条数");//必填项
                map.put("sEcho", sEcho);

猜你喜欢

转载自201609032307.iteye.com/blog/2377167