jQuery表格插件datatables用法详解

 $(document).ready(function() { 
$('#example').dataTable(); 
} ); 

 "bPaginate": true, //翻页功能 
"bLengthChange": true, //改变每页显示数据数量 
"bFilter": true, //过滤功能 
"bSort": false, //排序功能 
"bInfo": true,//页脚信息 
"bAutoWidth": true//自动宽度 

$(document).ready(function() { 
$('#example').dataTable( { 
"aaSorting": [ 
[ 4, "desc" ] 
] 
} ); 
} ); 

$(document).ready(function() { 
$('#example').dataTable( { 
"aoColumnDefs": [ 
{ "bSearchable": false, "bVisible": false, "aTargets": [ 2 ] }, 
{ "bVisible": false, "aTargets": [ 3 ] } 
] } ); 
} ); 

$(document).ready(function() { 
$('#example').dataTable( { 
"oLanguage": { 
"sLengthMenu": "每页显示 _MENU_ 条记录", 
"sZeroRecords": "抱歉， 没有找到", 
"sInfo": "从 _START_ 到 _END_ /共 _TOTAL_ 条数据", 
"sInfoEmpty": "没有数据", 
"sInfoFiltered": "(从 _MAX_ 条数据中检索)", 
"oPaginate": { 
"sFirst": "首页", 
"sPrevious": "前一页", 
"sNext": "后一页", 
"sLast": "尾页" 
}, 
"sZeroRecords": "没有检索到数据", 
"sProcessing": "" 
} 
} ); 
} ); 

$(document).ready(function() { 
$('#example').dataTable( { 
"aoColumns": [ 
null, 
{ "asSorting": [ "asc" ] }, 
{ "asSorting": [ "desc", "asc", "asc" ] }, 
{ "asSorting": [ ] }, 
{ "asSorting": [ ] } 
] 
} ); 
} ); 

 //声明jquery datatables 
  
 .....//datatables内容，此处省略 
 
 
  
 
  
Name 
  
 
  
Value 
  
 
  
DisplayOrder 
  
 
 
 
 
 
 
 
 
//添加按钮 
//编辑按钮 
//删除按钮 
 
 
//声明dialog,异步更新 
 @using (Ajax.BeginForm("Update", "Product", new AjaxOptions 
{ 
 UpdateTargetId = "d_Attributes", 
 OnSuccess= "dialogClose", 
 HttpMethod = "Post", 
})) 
 { 
 
 
  
 
  
    
   
Name
 
   
 
   *
 
  
 
  
 
   
Value
 
   
 
   *
 
  
 
  
 
   
DisplayOrder
 
   
 
   *
 
  
 
  
 
   
 
    
    
   
 
  
 
  
 
 
 
 } 
 

 
 
 
 
 -------------------------------------------------------------------------- 
 
-----------最简单的方式： 
 $(document).ready(function() { 
 $("#example").dataTable(); 
}); 
 
----------也可以自己定义各属性： 
 

/*
 * Example init
 */
$(document).ready(function(){
 $('#example').dataTable();
});