jquery.dataTable 绑定数据源

最新推荐文章于 2024-11-15 13:47:20 发布

原创最新推荐文章于 2024-11-15 13:47:20 发布 · 5.1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #数据

Web前端专栏收录该内容

274 篇文章

订阅专栏

本文介绍如何利用jQuery DataTable插件来展示用户信息，并自定义显示条数、分页样式及语言设置等。

var aoColumns=["userName","userID"];

var aaData=[{userName:"ejx",userID:"11"},{userName:"ejx01",userID:"22"}]

var oTable=$('#sample_editable_1').dataTable({

                    "iDisplayLength":15,
                    "sPaginationType": "bootstrap",
                    "oLanguage": {
                       "sLengthMenu": "_MENU_ records",
                       "oPaginate": {
                           "sPrevious": "Prev",
                           "sNext": "Next"
                         }
                     },
                     "aoColumnDefs": [{
                           'bSortable': false,
                            'aTargets': [0]
                      }],
                      "aLengthMenu": [[15, 25, 50,-1, 0],[15,25,50, "全部", "不显示数据"]],
                      "oLanguage": {
                           "sLengthMenu":"_MENU_ 条记录",
                           "sSearch":'搜索',
                           "sZeroRecords": "没有检索到数据",
                           "sInfo": "当前数据为从第 _START_ 到第 _END_ 条数据；总共有 _TOTAL_ 条记录",
                           "sInfoEmtpy": "没有数据",
                           "sInfoFiltered": "数据表中共为 _MAX_ 条记录",
                           "sProcessing": "正在加载数据...",
                           "sInfoEmpty": "显示 0 至 0 共 0 项",
                           "oPaginate": {
                               "sFirst": "首页",
                               "sPrevious":"上一页",
                               "sNext": "下一页",
                               "sLast": "尾页"
                           }
                       },
                      "bProcessing": true,
                      "aaData":aaData,
                      "aoColumns":aoColumns
               });