现在位置首页 / 项目实战 /正文

Jquery DataTable宽度设置百分比造成的高度撑开问题(宽度固定)

作者: IT小兵 | 2014年4月18日| 热度:℃ | 评论: |参与:

在一个电信项目中,使用Jquery DataTable ,因为电信的数据字段比较多。

所以Table的宽度我设置了百分比 100%.在数据多的情况下,是正常的,但是数据只有几条的情况下,

会出现把Table的高度撑得很大,一些列的宽度直接是一个字符那么宽。

现场如图:

当前的代码:

   oTable = $("#TablebillList").dataTable({
                        "aaData": tempdata, "bPaginate": false, 
                        "bFilter": false,
                        "aaSorting": [[ 0, "desc" ]],
                        "oLanguage": {
                            "sProcessing": "正在加载中......",
                            "sLengthMenu": "每页显示 _MENU_ 条记录",
                            "sZeroRecords": "正在加载中......",
                            "sEmptyTable": "查询无数据!",
                            "sInfo": "当前显示 _START_ 到 _END_ 条,共 _TOTAL_ 条记录",
                            "sInfoEmpty": "显示0到0条记录",
                            "sInfoFiltered": "数据表中共为 _MAX_ 条记录",
                            "sSearch": "当前数据搜索",
                            "oPaginate": {
                                "sFirst": "首页",
                                "sPrevious": "上一页",
                                "sNext": "下一页",
                                "sLast": "末页"
                            }
                        }, "bJQueryUI": true,
                        "sScrollY": "97%", "sScrollX": "98%",
                        "aoColumnDefs": [
                           { "sWidth": "50px",  "aTargets": [0] },
                           { "sWidth": "250px", "aTargets": ["jizhan"] },
                           { "sWidth": "100px", "aTargets": ["shichang"] },
                           { "sWidth": "250px", "aTargets": ["jizhan2"] },
                           { "sWidth": "150px", "aTargets": ["shijian"] }, 
                           { "sWidth": "150px", "aTargets": ["guishudi"] },
                           { "sWidth": "200px", "aTargets": ["haoma"] }
                        ],
                         "bProcessing": true,   
                        "bInfo": false, "bDestroy": true,
                        "fnRowCallback": function (nRow, aData, iDisplayIndex) {
                         return nRow;
                        }
                    });

问题在我设置了好几个列的宽度

aoColumnDefs  { "sWidth": "50px",  "aTargets": [0] },

,并设置了"sScrollX": "98%",这导致table计算每个宽度的时候,出错。

而且98%的宽度根本不够我分配的px总和多,所以基本上这个配置是无效的。。......

因为我肯定是需要对table进行x滚动条的。所以我设置了一个固定宽度。这个可以改成js计算宽度。

改成:

 "sScrollY": "60%", "sScrollX": "2000px",

自定义宽度去掉。


转发注明:IT分享  http://www.suchso.com 

点击阅读本文所属分类的更多文章: 项目实战 。和高手一起交流:346717337
友荐云推荐

未注明转发、原文均为本站原创。分享本文请注明 原文链接

给您更多信息和帮助

在这里您可以找到更多:

技术交流群:346717337 Jquery插件交流

投稿:suchso@vip.qq.com

承接:企业网站门户/微网站/微商城/CMS系统/微信公众号运营/业务咨询

抢天猫双11红包
推荐使用阿里云服务器
echarts教程系列
本月最热文章

微信扫一扫,徜徉悠嘻网,您的休闲乐园

微信公众号:快乐每一天

随机文章
标签

技术交流群:346717337

投稿:suchso@vip.qq.com

专业专注:企业网站门户/微网站/微商城/CMS系统/微信公众号运营/付费问题咨询