gpt4 book ai didi

jquery - 为什么现在显示数据表的列标签?

转载 作者:行者123 更新时间:2023-12-01 04:03:18 25 4
gpt4 key购买 nike

我正在尝试使用DataTable显示ajax请求完成后的数据。

这是我所做的

创建了一个基本表

<div class="wrapper hiddenBlock" id="ReportWrapper">

<table id="reportTable" class="display">
<thead>
</thead>
<tbody>
</tbody>
</table>

</div>

这是我如何发出ajax请求

<script>

$(function(e) {


$('#CampaignMenu').change(function(e) {

$('#ReportWrapper').hide();

if ( $(this).val() != '0') {
$('#DisplayReport').attr('disabled', false);
} else {
$('#DisplayReport').attr('disabled', true);
}

});

$('#DisplayReport').click(function (e) {


$.ajax({
type: 'GET',
url: '/GetReportData',
data: { 'campaign_id': $('#CampaignMenu').val() },
dataType: 'json',
success: function (json) {

$('#reportTable').DataTable({
"data": json,
columns: [
{ data: 'chainName' },
{ data: 'storeID' },
{ data: 'completed_ll' },
{ data: 'initial_quota_ll' },
{ data: 'totalCallableLL' },
{ data: 'currentStatusLL' },
{ data: 'completed_cp' },
{ data: 'initial_quota_cp' },
{ data: 'totalCallableCP' },
{ data: 'currentStatusCP' }
]
});
$('#ReportWrapper').show();
}
});

});

});

</script>

数据返回并填充表。但它不显示列标题,并且表格的样式与 display 状态不匹配 here

这就是我所看到的

enter image description here

如何让标签和样式发挥作用?

最佳答案

您需要在 thead 元素中或使用 column.title 指定列标题选项。

例如,要使用 column.title 指定标题选项:

$('#reportTable').DataTable({
"data": json,
columns: [
{ data: 'chainName', title: 'A' },
{ data: 'storeID', title: 'B' },
{ data: 'completed_ll', title: 'C' },
{ data: 'initial_quota_ll', title: 'D' },
{ data: 'totalCallableLL', title: 'E' },
{ data: 'currentStatusLL', title: 'F' },
{ data: 'completed_cp', title: 'G' },
{ data: 'initial_quota_cp', title: 'H' },
{ data: 'totalCallableCP', title: 'I' },
{ data: 'currentStatusCP', title: 'J' }
]
});

您还可以使用 thead 标记指定列标题,而不是使用 column.title像这样的选项:

<table id="reportTable" class="display">
<thead>
<tr>
<th>A</th>
<th>B</th>
<th>C</th>
<th>D</th>
<th>E</th>
<th>F</th>
<th>G</th>
<th>H</th>
<th>I</th>
<th>J</th>
</tr>
</thead>
<tbody>
</tbody>
</table>

关于jquery - 为什么现在显示数据表的列标签?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35804705/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com