dataTables 使用方式 （draw:刷新當前頁 reload: 重新加載頁碼為1）

$(document).ready(function(){
table= $('#user_table').DataTable({
"paging": true,
"ordering":false,//排序
"aLengthMenu": [10, 25, 50],//設置頁碼
"searching":false,
"serverSide": true,//必須存在
"ajax": {
"url": "/index.php/user/user_Index",
"data": function ( d ) {
var user_name = $('#user_name').val(); //名稱
//添加額外的參數傳給服務器
d.user_name = user_name;
}
},

//回調函數
"drawCallback": function( settings ) {
$('#user_table_length').css('float','left');
if($('#btn_add').length<=0){
$('<a id="btn_add" class="btn btn-primary" onclick="btn_add()">新增用戶</a>').insertBefore($('#user_table_length'));
}
}

});


})

 

<div class="ibox-content">
	<div class="form-group">
		<label for="food_name" class="sr-only">名稱</label>
		<div class="col-sm-2" style="padding:0px;">
			<input type="text" placeholder="員工姓名" id="user_name" class="form-control">
		</div>
		<div class="col-sm-3">
			<button class="btn btn-primary" type="button" onclick='search()' style="margin: 0;">
			查詢</button>
		</div>
	</div>
</div>
<div class="ibox-content">											
	<table class="table table-striped table-bordered table-hover dataTables-example" width="100%"  id="user_table">
		<thead>
			<tr>
				<th width="11%">姓名</th>
				<th width="11%">工號</th>
				<th width="5%">性別</th>
				<th width="11%">手機</th>
				<th width="15%">Email</th>
				<th width="30%">部門/崗位</th>
				<th width="25%">操作</th>
			</tr>
		</thead>
		<tbody>
		</tbody>
	</table>
</div>