ASP.NET使用Jquery datatable列表插件

最近的项目改用bootstrap样式，表格列表也使用Jquery DataTable插件。样式挺美观的。先来张截图：

1、初始化表格插件

oTable = table
                    .DataTable(
                            {
                                "language": GlobalDataTablesLang,
                                "ordering": false, //开关，排序功能    是否能排序
                                "pageLength": 10, // 默认每页记录数
                                "searching": false, //开关，过滤功能  显示搜索
                                "lengthChange": true, //开关，改变每页显示数据数量  显示
                                "lengthMenu": [ // 设置每页多少记录数
                                [5, 10, 15, 25, 50, 100],
                                        [5, 10, 15, 25, 50, 100]],
                                "bRetrieve": false,
                                "columns": [{
                                    "data": "PostID"
                                }, {
                                    "data": "PostID"
                                }, {
                                    "data": "PostName"
                                }, {
                                    "data": "PostGuid"
                                }, {
                                    "data": "PostBZ"
                                }],
                                "serverSide": true,
                                "ajax": {
                                    "url": "action/GetUserList",
                                    "type": "POST"
                                },
                                "fnPreDrawCallback": function () {
                                    App.startPageLoading();
                                    return true;
                                },
                                "fnDrawCallback": function () {
                                    App.stopPageLoading();
                                    RenderCheck();
                                },
                                "fnRowCallback": function (nRow, aData, iDataIndex) {
                                    return nRow;
                                }
                            });

                        }

 

2、后台返回的数据格式

 

{"draw":"1","recordsTotal":3,"recordsFiltered":3,"data":[{"PostID":0,"PostName":"财务","PostGuid":"f45d761fdbd34dbcbf2d088247a745b8","PostBZ":""},
{"PostID":0,"PostName":"馆长","PostGuid":"f4eaba3b7a6d42ba90be23edbd863d8f","PostBZ":""},
{"PostID":0,"PostName":"前台人员","PostGuid":"66cceb2fa22f42b3acda6a069529132d","PostBZ":""}]}

 

 3、刷新表格

oTable.ajax.reload();