相关疑难解决方法(0)
datatable jquery - 表头宽度未与主体宽度对齐
我正在使用jQuery数据表.运行应用程序时,标题宽度与主体宽度不对齐.但是当我点击标题时,它会与身体宽度对齐,但即便如此,也会出现一些轻微的错位.此问题仅在IE中出现.
这是页面加载时的样子:
点击标题后:
我的数据表代码:
$("#rates").dataTable({
"bPaginate": false,
"sScrollY": "250px",
"bAutoWidth": false,
"bScrollCollapse": true,
"bLengthChange": false,
"bFilter": false,
"sDom": '<"top">rt<"bottom"flp><"clear">',
"aoColumns": [{
"bSortable": false
},
null,
null,
null,
null
]
});
rates是我的表id.
任何人都可以帮我这个吗？提前致谢.
推荐指数
解决办法
查看次数
响应式Bootstrap数据表不会在正确的位置折叠列
我正在使用Datatables.net最新版本,带有数据表和引导程序.我想我的问题是:Datatables Responsive Bootstrap用于检测溢出,因为它显然不是父宽度.
这是我的结果:
这是一个非常直接的问题.如果我减少窗口的宽度1个像素,列最终会崩溃.如果我然后展开它,它将返回到此状态.我想防止父引导程序面板溢出.我已经删除了bootstrap网格div(row/col-xs-12等)来消除potitial问题,但是一旦解决了这个问题(或者我更好地理解了这个问题),我打算也使用bootstrap网格系统.
这是一个完美复制问题的plunkr(折叠运行视图):http://plnkr.co/edit/tZxAMOHmdoHNHrzhP5tR？p = preview
<!DOCTYPE html>
<html>
<head>
<title>Tables - PixelAdmin</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"/>
<link rel="stylesheet" href="http://cdn.datatables.net/plug-ins/a5734b29083/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="http://cdn.datatables.net/responsive/1.0.2/css/dataTables.responsive.css"/>
<style>
body {
font-size: 140%;
}
table.dataTable th,
table.dataTable td {
white-space: nowrap;
}
</style>
</head>
<body style="padding-top: 40px;">
<div class="panel panel-primary" style="margin: 51px; padding: 0;">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
<div class="panel-body" style="padding: 0;">
<div style="width: 100%; border: 1px solid red;">
<table id="example" class="table table-striped table-hover dt-responsive" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th> …推荐指数
解决办法
查看次数
DataTables.js-表在页面加载时未加载初始100％全宽
我正在使用DataTables固定标头功能将PHP页面与表一起加载。在页面渲染时，我似乎无法使表格处于页面负载的100％。它开始于压缩（加载时），然后扩展（一次页面渲染）。
我试图通过在PHP中进行输出缓冲来解决此问题，但无法获得压缩效果，然后扩展消失。
初始化代码（在脚本底部）
$(document).ready(function() {
$('#summary_table').DataTable( {
"scrollY": 400,
"scrollX": true,
"bSort": false,
"bPaginate": false,
"autoWidth": false
} );
$(".dataTables_wrapper").css("width","100%");
});
编辑：
（表在加载过程中被压缩，但随后达到100％。）
的PHP
<html>
<head>
<title>Action Item Summary</title>
<link rel="stylesheet" type="text/css" href="../css/style.css"/>
<style>
thead th {
background-color:#0038a8;
font-weight: bold;
font-style: italic;
color: white;
text-align: left;
}
table:not(#header):not(#menu):not(#find) {
background-color: white;
width: 100%;
}
td {
width: auto;
min-width: auto;
white-space: nowrap;
}
input[type='text'] {
width: 50%;
min-width: 100%;
}
span {
white-space: nowrap;
}
span.late{
color: red;
}
thead …推荐指数
解决办法
查看次数
数据表宽度问题
我正在使用带有 jQuery 的 DataTables 插件，并且我已经查看了 StackOverflow 并发现了另一个问题几乎相同的问题（除了我没有选项卡），我尝试了它在那里所说的但无法使其工作。我在表格中有这个下拉菜单，只显示 50 条记录（下面代码中的 iDisplayLenth），当您选择 100 或超过表格时，表格会完全调整大小，我不知道为什么。任何帮助或建议将不胜感激。这是我用于创建表格的 HTML：
<table id="content-table-redesign" class="display">
然后是与之相关的css
#content-table-redesign{border-collapse: separate;width:1241px;margin:0 auto;}
#content-table-redesign th{min-width:45px;color:#2e2e2e;}
和在这一点上的 js 几乎是我最初拥有的和我在另一个链接上找到的建议的混合。一切都在 $document(function(){}); 内完成；
var oTable = $('#content-table-redesign').dataTable({
"oLanguage": {
"sLengthMenu": "Display _MENU_ records per page",
"sZeroRecords": "Nothing found - sorry",
"sInfo": "Showing _START_ to _END_ of _TOTAL_ records",
"sInfoEmpty": "Showing 0 to 0 of 0 records",
"sInfoFiltered": "(filtered from _MAX_ total records)"
},
"aaSorting": [[ 0, "asc" ]],
"bAutoWidth": false,
"iDisplayLength": 50,
"aLengthMenu": [10, …推荐指数
解决办法
查看次数