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 ...

随机推荐

LFI漏洞利用总结
主要涉及到的函数 include(),require().include_once(),require_once() magic_quotes_gpc().allow_url_fopen().allo ...
学习cocos 空程序
今天开始学习cocos代码,首先研究源码中的空程序. 在这个程序中,在main函数中,创建了一个Application: int APIENTRY _tWinMain(HINSTANCE hInsta ...
自己封装的操作DOM方法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
IOS-利用AFNetworking监听网络状态
网络环境检测:检测用户当前所处的网络状态效果图 1.当蜂窝和wifi同时关闭时候显示为不可达(AFNetworkReachabilityStatusNotReachable)状态 2.打开蜂窝移 ...
K910 升级Android 4.4.2可用的Google Service Framework
把手机换成了K910, 看上的是骁龙800的cpu和电子罗盘... 比V987是升级一大截了. 花了一个晚上加半个上午的时间终于搞定了GoogleServiceFramework, 试了大概四五个网上 ...
Spring 依赖注入方式详解
平常的Java开发中,程序员在某个类中需要依赖其它类的方法. 通常是new一个依赖类再调用类实例的方法,这种开发存在的问题是new的类实例不好统一管理. Spring提出了依赖注入的思想,即依赖类不由 ...
项目分享一：在项目中使用 IScroll 所碰到的那些坑
最近做了个 WEB APP 项目,用到了大名鼎鼎的 IScroll,滚动的效果的确很赞,但是坑也是特别多,下面总结一下,希望自后来者有帮助. 该项目现已开源在 github 上,https://git ...
Bootstrap系列 -- 7. 列表排版方式
一. 去点列表 1. 使用class=list-unstyled <ul > <li>无序列表项目</li> <li>无序列表项目</li> ...
Codeforces Round #369(div 2)
A:=w= B:=w= C:题意:有一排树,有的树已经上色,有的树没有上色,只能给没上色的树上色,一共m种颜色,不同的树上不同的色花费不同,涂完色后,连续颜色的树成为一段.对于给定的段数k,求出最小花 ...
MVC中使用Ajax提交数据 Jquery Ajax方法传值到action
Jquery Ajax方法传值到action <script type="text/javascript"> $(document).ready(function(){ ...

jquery datatable

jquery datatable的更多相关文章

随机推荐

热门专题