列宽在数据表引导中无法工作 [英] Column width not working in datatables bootstrap
问题描述
我使用以下代码来设置datatable的列宽。在部分页面加载期间,宽度看起来是正确的,当它完全加载时,宽度是关闭的。
I am using the following code to set the column width of datatable. During partial page load the width appears to be correct and when it loads completely, the width is off.
<script>
$(document).ready(function () {
$("#memberGrid").dataTable({
"dom": 'T<"clear">lfrtip',
"tableTools": {
"sSwfPath": "../../Content/swf/copy_csv_xls.swf"
},
"destroy": true,
"info": true,
"bLengthChange": false,
"bFilter": false,
"bAutoWidth": false,
"aoColumns": [{ "sWidth": "20%" }, { "sWidth": "20%" }, { "sWidth": "20%" }, { "sWidth": "10%" }, { "sWidth": "20%" }, { "sWidth": "10%" }]
});
});
</script>
表标记
<table class="group-grid table table-hover table-bordered table-responsive zebra-striped" id="memberGrid">
<thead class="tablehead">
<tr>
<th style="width: 20%">Name</th>
<th style="width: 20%">Room with</th>
<th style="width: 20%">Extensions</th>
<th style="width: 10%">Travel Protection</th>
<th style="width: 20%">Flying from</th>
<th style="width: 10%">Balance</th>
</tr>
</thead>
<tbody>
<tr class="tablerows">
<td style="width: 20%"><%# Eval("Travelers") %></td>
<td style="width: 20%"><%# Eval("RoomMates")%></td>
<td style="width: 20%"><%# Eval("Extensions")%></td>
<td style="width: 10%"><%# (string) Eval("HasTpp") == "Y"? "Yes" : "No"%></td>
<td style="width: 20%"><%# Eval("Airport")%></td>
<td style="width: 10%">$<%# Eval("Balance")%></td>
</tr>
</tbody>
</table>
推荐答案
定义datatable属性时使用以下脚本: p>
Use the following script when defining datatable properties:
列:[
{width:25px},
{width:25px
{width:450px},
{width:20px},
{width:20px},
{ width:20px},
{width:20px},
{width:20px}
],
"columns": [ { "width": "25px" }, { "width": "25px" }, { "width": "450px" }, { "width": "20px" }, { "width": "20px" }, { "width": "20px" }, { "width": "20px" }, { "width": "20px" } ],
这篇关于列宽在数据表引导中无法工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!