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

随机推荐

Extjs API - JS Duck
1. 安裝JS Duck3 tar.gz版本 https://nodeload.github.com/senchalabs/jsduck/tarball/master exe版本 http://c ...
JavaScript Date 对象
JavaScript Date 对象 Date 对象 Date 对象用于处理日期与实际. 创建 Date 对象: new Date(). 以上四种方法同样可以创建 Date 对象: var d = n ...
CentOS 6.6 安装redmine
Redmine是一个开源的.基于Web的项目管理和缺陷跟踪工具.它用日历和甘特图辅助项目及进度可视化显示.同时它又支持多项目管理.Redmine是一个自由开放源码软件解决方案,它提供集成的项目管理功能 ...
Mysql备份系列（2）--mysqldump备份（全量+增量）方案操作记录
在日常运维工作中,对mysql数据库的备份是万分重要的,以防在数据库表丢失或损坏情况出现,可以及时恢复数据. 线上数据库备份场景:每周日执行一次全量备份,然后每天下午1点执行MySQLdump增量备份 ...
XMAPP配置
F:\xmapp\apache\conf\extra httpd-vhosts.conf peizhi##<VirtualHost *:80> ## DocumentRoot " ...
php中Jpgraph的运用
用Jpgraph,只要了解它的一些内置函数,可以轻松得画出折线图.柱形图.饼状图等图表. 首先要保证PHP打开了Gd2的扩展: 打开PHP.ini,定位到extension=php_gd2.dll,把 ...
mediaplayer与surfaceView,无法播放问题
mediaplayer需要在surfaceView创建之后才能创建,不然会导致错误. surfaceholder = msurface.getHolder(); surfaceholder.setKe ...
XmlSpy / XSD 以及验证
很早以前看过一句话:“XML就象空气”,在企业应用开发中XML是一个重要的数据交换标准.而XSD则可以用来校验XML的数据格式是否正确. 一个典型的XSD文件如下: <?xml version= ...
KMS10流氓软件
win10想激活,结果中了流氓软件的当... (关键是win10家庭单语言版居然还激活不了....白吃亏了) 把我的chrome 和 firefox 主页改成hao.qquu8.com,该网址重定向到 ...
APP架子迁移指南（二）
接上一篇,这一篇开始用android来解释MVP概念.八股式的架子结构和命名规范.我在准备这篇文章的时候还看到不少在MVP基础上衍生的架子思路,底子是MVP没错,但命名有区别.复杂度变了.架子也用到了 ...

jquery datatable

jquery datatable的更多相关文章

随机推荐

热门专题