jquery datatable

<html><head></head>

<script type="text/javascript">
        $(document).ready(function () {
            $("#datatable1").dataTable({
                "bPaginate": true,//开关是否分显示页器
                "bInfo": true,//开关，是否显示表格的一些信息
                "bFilter": true,//开关，是否启用客户端的过滤器
                "sDom": "<>Ifrtip<>",
                "bAutoWith": false,
                "bDeferRender": false,
                "bJqueryUI": false,//开关，是否启用jQueryUI风格
                "bLengthChange": true,//开关，是否显示每页大小的下拉框
                "bProcessing": true,
                "bScrollInfinite": false,
                "sScrollY": "800px",//是否启用垂直滚动条，以及指定滚动区域大小，可设值为："disabled":"2000px"
                "bSort": true,//开关是否启用各列具有按列排序的功能
                "bSortClasses": true,
                "bStateSave": false,//开关，是否打开客户端状态记录功能。
                //这个数据是记录在cookies中的，打开了这个记录后，即使刷新一次页面，
                //或重新打开浏览器，之前的状态都是保存下来的- ------当值为true时aoColumnDefs不能隐藏列
                "sScrollX": "50%",//是否开启水平滚动，以及指定滚动区域的大小，可设置值"disabled":"2000%"
                "aaSorting": [[0, "asc"]],
                "aoColumnDefs": [{ "bVisible": false, "aTargets": [0] }],//隐藏列
                "sDom": "<'H'if>t<'F'if>",
                "bAutoWidth": false,//自适应宽度
                "aaSorting": [[1, "asc"]],
                "sPaginationType": "full_numbers",
                "oLanguage": {
                    "sProcessing": "正在加载中......",
                    "sLengthMenu": "每页显示_MENU_条记录",
                    "sZeroRecords": "对不起，查询不到数据",
                    "sEmptyTable": "表中无数据存在！",
                    "sInfo": "当前显示_START_到_END_条，共_TOTAL_条记录",

                    "sInfoFiltered": "数据表中共为_MAX_条记录",
                    "sSearch": "搜索",
                    "oPaginate":{
                        "sFirst": "首页",
                        "sPrevious": "上一页",
                        "sNext": "下一页",
                        "sLast":"末页"
                    }
                }//多语言配置
            });

        });
    </script>

</head>
<body>
    <table cellpadding="0" cellspacing="0" border="0" class="display" id="datatable1">
        <thead>
            <tr>
                <th>姓名</th>
                <th>性别</th>
                <th>年龄</th>
                <th>地址</th>
            </tr>
        </thead>

        <tbody>
            <tr class="old gradeX">
                <td>
                    XXX
                </td>
                <td>
                    男
                </td>
                <td class="center">
                    12
                </td>
                <td class="center">
                    济南
                </td>
            </tr>

            <tr class="old gradeX">
                <td>
                    ZZZ
                </td>
                <td>
                    男
                </td>
                <td class="center">
                    11
                </td>
                <td class="center">
                    北京
                </td>
            </tr>

            <tr class="old gradeX">
                <td>
                   HHH
                </td>
                <td>
                    男
                </td>
                <td class="center">
                    15
                </td>
                <td class="center">
                    上海
                </td>
            </tr>
        </tbody>
    </table>
</body>
</html>

jquery datatable的更多相关文章

jquery dataTable汉化（插件形式）
1.jquery dataTable.js 官网:http://datatables.net/ 中文:http://dt.thxopen.com/ 2.汉化提示信息(放到xx.js中,引入即可) 注: ...
JQuery Datatable Ajax请求两次问题的解决
最近一个项目中使用JQuery Datatable,用起来比较方便,但在测试过程中,发现当条件改变时,有时查询结果中的数据不正确. 使用FireBug跟踪时,发现在使用Ajax请求时,点击一次搜索按钮 ...
分享在MVC3.0中使用jQuery DataTable 插件
前不久在网络上看见一个很不错的jQuery的DataTable表格插件.后来发现在MVC中使用该插件的文章并不多.本文将介绍在MVC3.0如何使用该插件.在介绍该插件之前先简单介绍一下,推荐该插件的原 ...
jQuery DataTable 删除数据后重新加载
问题描述: 利用jQuery Datatable和artTemplate组合来做的表格.但是当删除数据时,需要重新加载table里的数据.但是问题是datatable并没有直接的重新渲染,反而给数据累 ...
JQuery Datatable用法
原文出处:http://sgyyz.blog.51cto.com/5069360/1408251 目标: 使用jQuery Datatable构造数据列表,并且增加或者隐藏相应的列,已达到数据显示要求 ...
jQuery Datatable 转载
jQuery Datatable 实用简单实例时间 2014-05-08 10:44:18 51CTO推荐博文原文 http://sgyyz.blog.51cto.com/5069360/14 ...
JQuery DataTable的配置项及事件
当我们需要在加载或者显示表格的时候,改变jquery datatable 的数据,或增加一些html标签处理. 可以通过Jquery DataTable的回调函数处理. 实例代码: if (oTabl ...
jquery datatable 多行(单行)选择(select)，行获取/行删除
jquery datatable 多行(单行)选择(select),行获取/行删除代码展示 // 示例数据源 var dataSet = [ ['Tasman','Internet Explorer ...
jquery datatable设置垂直滚动后，表头(th)错位问题
jquery datatable设置垂直滚动后,表头(th)错位问题问题描述: 我在datatable里设置:"scrollY": '300px',垂直滚动属性后,表头的宽度就会 ...
jquery datatable 获取当前分页的数据
使用jquery datatable 遇到分页分别求和时,找了半天才找到获取当前分页数据的方法,以此总结 var table=$('#example').DataTable( { "pagi ...

随机推荐

转：软件架构入门（from 阮一峰）
说明:其中讲到了 5 种的架构模型,很不错. from: http://www.ruanyifeng.com/blog/2016/09/software-architecture.html
javascript获取元素的方法[xyyit]
1. javascript默认的方法: <div id=”div_id” class=”div_class” name=”div_name”></div> //1. 根据id ...
比较全的JavaScript倒计时脚本[xyytit]
需要做一个功能,给特定的活动或者商品添加一个倒计时提示,在网上找了好些方法,总结了比较好的一些方法,以备后用: 1. 比较长时间的倒计时(如:距离2014年还有0年, 0月, 30天, 9小时, 41 ...
ajax asud模板
<table class="table"> <tr> <th>@Html.DisplayNameFor(model=>model.Id)& ...
oracle plsql 捕获异常和抛出异常
在写oracle存储过程的时候很多东西放到存储过程里面比如一些判断等,要比在程序逻辑里面简单很多,但是也会涉及到捕获和抛出一样的问题. 捕获异常语法: 首先定义异常: <异常情况> E ...
阿里云消息队列MQ_HTTP接入 for .NetCore 简单例子
, , )).TotalMilliseconds; , , )).TotalMilliseconds; ) ...
cell与cell之间的间距问题,以及section跟随屏幕滑动而滑动问题
苹果在cell与cell之间默认没有间距,这样有时候不能满足我们界面要求,所以我们就需要将cell设置为分组模式(也就是每组一行或者多行,分为n组),然后我们就可以在代理中根据自己的需求设计cell之 ...
FSL - DualRegression
Source:http://fsl.fmrib.ox.ac.uk/fsl/fslwiki/DualRegression Research Overview A common need for anal ...
Windows 8.1 新增控件之 CommandBar
上一篇为大家介绍了AppBar 的相关内容,本篇继续介绍CommandBar 的使用方法.与AppBar 相比而言,CommandBar 在开发使用方面较为单一,在按键布局上分为主控区(Primary ...
Spring Security笔记：使用BCrypt算法加密存储登录密码
在前一节使用数据库进行用户认证(form login using database)里,我们学习了如何把“登录帐号.密码”存储在db中,但是密码都是明文存储的,显然不太讲究.这一节将学习如何使用spr ...

jquery datatable

jquery datatable的更多相关文章

随机推荐

热门专题