1

我第一次使用数据表并被以下解释的问题所震惊。当我尝试包含垂直滚动时，列标题会丢失所有 itz 对齐，所有列宽都会减小，因此会得到标题行的长度是整个桌子的一半。

我注意到的另一件事是，在第 th 类样式中，宽度为 0px，任何人都可以理解为什么会这样吗？我已经包含的 js 部分，

$(document).ready(function() {

                $.ajax({
                    type : "GET",
                    url :"",

                    dataType : "json",
                    success : function(data) 
                    {
                            $('#customers').dataTable(
                            {
                            "aaData":data.response,
                            "aoColumns": [
                            { "sTitle": "Rendering Engine", "bSortable": false},
                            { "sTitle": "Broswers", "bSortable": false },
                            { "sTitle": "Platform", "bSortable": false }
                            ],
                         "sScrollY": "250px",
                        "iDisplayLength": 200,
                        "bFilter": false,
                        "bLengthChange": false,
                        "bAutoWidth": false
                           });
                    }   
                });
            });

和html部分

<table id="customers"></table>

提前致谢 ！

4

3 回答 3

4

我通过使用带有溢出的 div 包装“dataTable”表解决了这个问题：auto

.dataTables_scroll
{
    overflow:auto;
}

并在你的 dataTable 初始化后添加这个 JS

jQuery('.dataTable').wrap('<div class="dataTables_scroll" />');

不要使用 sScrollX 或 sScrollY，然后删除并自己添加一个 div 包装器，它做同样的事情。

于 2013-08-17T18:52:07.600 回答
0 
    success : function(data) 
                {
                        $('#customers').dataTable(
                        {
                        "aaData":data.response,
                        "aoColumns": [
                        { "sTitle": "Rendering Engine", "bSortable": false},
                        { "sTitle": "Broswers", "bSortable": false },
                        { "sTitle": "Platform", "bSortable": false }
                        ],
                     "sScrollX": "100%",
                     "sScrollY": "250px",
                    "iDisplayLength": 200,
                    "bFilter": false,
                    "bLengthChange": false,
                    "bFilter": true,
                    "bSort": true,
                    "aLengthMenu": [50,100,250,500],
                    "sPaginationType": "full_numbers"
                       });
                }   





  //use this style
 <style type="text/css">

       .dataTables_length {
       float: left;
       width: 40%;
        }

    .dataTables_filter {
      float: right;
      text-align: right;
      width: 50%;
      } 

  .dataTables_info {
   float: left;
   width: 50%;
  vertical-align: middle;
  /*min-height: 100%;*/
  /*position: absolute;*/
  }
</style>
于 2012-07-23T08:01:29.253 回答
0

问题是你的桌子是空的。我过去见过类似的问题，它们总是由您的表没有<thead>/引起的<tbody>。

将您的 HTML 更改为：

<table id="customers">
    <thead>
    </thead>
    <tbody>
    </tbody>
</table>

让我知道发生什么事。

于 2012-09-04T08:59:24.490 回答