注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

php开发lamp

《西安--木木》-经历丰富了生活。 架构师QQ群: 246695517

 
 
 

日志

 
 

Jquery DataTables 之完全总结(二)  

2014-05-07 17:37:22|  分类: jquery |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
三、代码实例属性说明

/$(document).ready(function() {
    //$('#example').dataTable( {//加载
        //"bPaginate": true,//分页按钮
        //"bLengthChange": true,//每行显示记录数
        //"bFilter": true,//搜索栏
        //"bSort": true,//排序
        //"bInfo": true,//Showing 1 to 10 of 23 entries  总记录数没也显示多少等信息
        //"bAutoWidth": true } );
//} );


//$(document).ready(function() {
    //$('#example').dataTable( {
        //"aaSorting": [[ 4, "desc" ]]//给列表排序 ,第一个参数表示数组 。4 就是css grade那列。第二个参数为 desc或是asc
    //} );
//} );


//$(document).ready(function() {
    //$('#example').dataTable( {
        //"aoColumns": [ 
        //    /* Engine */   null,  //默认
        //    /* Browser */  null,
        //    /* Platform */ { "bSearchable": false, //不可参与搜索
        //                     "bVisible":    false },//不可见
        //    /* Version */  { "bVisible":    false },//不可见
        //    /* Grade */    null
        //] } );
//} );



//$(document).ready(function() {
    //$('#example').dataTable({
    //});
//} );



//$(document).ready(function() {
    //$('#example').dataTable( {
        //"sDom": '<"top"i>rt<"bottom"flp<"clear">' //这段是自定义布局没搞明白挺复杂 的。    *  l - Length changing * f - Filtering input* t - The table!* i - Information* p - Pagination* r - pRocessing* < and > - div elements* <"class" and > - div with a class    * Examples: <"wrapper"flipt>, <lf<t>ip>

    //} );
//} );



//$(document).ready(function() {
//    $('#example').dataTable( {
    //    "bStateSave": true //保存状态到cookie *************** 很重要 , 当搜索的时候页面一刷新会导致搜索的消失。使用这个属性就可避免了
    //} );
//} );

//$(document).ready(function() {
    //$('#example').dataTable( {
        //"sPaginationType": "full_numbers" //分页,一共两种样式 另一种为two_button  是datatables默认
    //} );
//} );

//$(document).ready(function() {
    //$('#example').dataTable( {  //分页信息 不是很难理解。
        //"oLanguage": {
            //"sLengthMenu": "Display _MENU_ records per page",
            //"sZeroRecords": "Nothing found - sorry",
            //"sInfo": "Showing _START_ to _END_ of _TOTAL_ records",
            //"sInfoEmtpy": "Showing 0 to 0 of 0 records",
            //"sInfoFiltered": "(filtered from _MAX_ total records)"
        //}
    //} );
//} )

$(document).ready(function() {
    oTable = $('#example').dataTable({
        "bJQueryUI": true, //可以添加 jqury的ui theme  需要添加css
        "sPaginationType": "full_numbers"
    });
} );

默认的语言是英文的 当然可以国际化:
"sUrl": "/SSS/dataTables/de_DE.txt" 添加个国际化的文件就可以。 名字随便 路径对了就可以。我写的国际化文件内容如下,可以直接复制到txt中使用.

{
"sProcessing": "Bitte warten...",
"sLengthMenu": "显示_MENU_条 ",
"sZeroRecords": "没有您要搜索的内容",
"sInfo": "从_START_ 到 _END_ 条记录——总记录数为 _TOTAL_ 条",
"sInfoEmpty": "记录数为0",
"sInfoFiltered": "(全部记录数 _MAX_  条)",
"sInfoPostFix": "",
"sSearch": "搜索",
"sUrl": "",    //"sUrl": "dataTables/de_DE.txt" 添加个国际化的文件
"oPaginate": {
"sFirst":    "第一页",
"sPrevious": " 上一页 ",
"sNext":     " 下一页 ",
"sLast":     " 最后一页 "
}
}

de_DE.txt内容如下:

{
    "sProcessing":   "处理中...",
    "sLengthMenu":   "显示 _MENU_ 项结果",
    "sZeroRecords":  "没有匹配结果",
    "sInfo":         "显示第 _START_ 至 _END_ 项结果,共 _TOTAL_ 项",
    "sInfoEmpty":    "显示第 0 至 0 项结果,共 0 项",
    "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
    "sInfoPostFix":  "",
    "sSearch":       "搜索:",
    "sUrl":          "",
    "oPaginate": {
        "sFirst":    "首页",
        "sPrevious": "上页",
        "sNext":     "下页",
        "sLast":     "末页"
    }
}
  评论这张
 
阅读(444)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017