$.ajax({
url:'a.php',
method:'POST',
data:{s:s1, month:s2, year:s3},
dataType:'json',
success:function(data){
var a = data[0];
//var b = data[1];
// var len = b.length;
var t = document.getElementById('tbl_1');
$(t).find('td:eq(2)').text(a[0].a);
$(t).find('td:eq(3)').text(a[0].b);
$(t).find('td:eq(4)').text(a[0].bd);
$(t).find('td:eq(5)').text(a[0].ab);
$(t).find('td:eq(6)').text(a[0].bc);
$(t).find('td:eq(7)').text(a[0].bo);
}
});
我要打印我的桌子,我一直在关注这两个例子 https://datatables.net/extensions/buttons/examples/initialisation/simple.html https://datatables.net/extensions/buttons/examples/print/columns.html
按钮正在显示并正常工作,但在我的情况下,很少有表单元格从数据库中填充。 ajax工作正常,并且数据正在从数据库显示,但是当我单击打印数据时未显示我的表结构是
<div class="panel-body">
<div style = "width:97%" >
<h3 align="center" style="text-transform: uppercase">------: </h3><br>
<br>
<table id = "tbl_1" class="table table-striped table-bordered table-hover" >
<thead>
<tr>
<th style="font-weight: bold; text-transform: uppercase">Sr.No</th>
<th style="font-weight: bold; text-transform: uppercase">a</th>
<th style="font-weight: bold; text-transform: uppercase"> b</th>
<th style="font-weight: bold; text-transform: uppercase">c </th>
<th style="font-weight: bold; text-transform: uppercase">d</th>
<th style="font-weight: bold; text-transform: uppercase">e</th>
<th style="font-weight: bold; text-transform: uppercase">f</th>
<th style="font-weight: bold; text-transform: uppercase">g</th>
</tr>
</thead>
<tbody>
<tr>
<td>1.</td>
<td>a</td>
<td id = "af"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>2.</td>
<td>b</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>3.</td>
<td>c</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>4.</td>
<td>d</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
</tbody>
</table>
</div>
</div>
我的JavaScript代码在这里
$(document).ready(function() {
$('#tbl_1').DataTable( {
dom: 'Bfrtip',
buttons: [
{
extend: 'print',
exportOptions: {
columns: ':visible'
}
},
'colvis'
],
// columnDefs: [ {
// targets: -1,
// visible: true
// } ]
} );
});
数据显示在表格中
但是当我单击打印表时,除了这样的设计值之外,它是空的
我在这里做错了什么?
答案 0 :(得分:1)
我已经测试过将静态数据放入<td></td>
并使用单元格中的数据进行精细打印
所以您可以显示ajax函数
我的猜测是
/// <td></td>
完成从ajax的数据库填充之后,将其放入ajax成功的内部
$.ajax({
url:'a.php',
method:'POST',
data:{s:s1, month:s2, year:s3},
dataType:'json',
success:function(data){
var a = data[0];
//var b = data[1];
// var len = b.length;
var t = document.getElementById('tbl_1');
$(t).find('td:eq(2)').text(a[0].a);
$(t).find('td:eq(3)').text(a[0].b);
$(t).find('td:eq(4)').text(a[0].bd);
$(t).find('td:eq(5)').text(a[0].ab);
$(t).find('td:eq(6)').text(a[0].bc);
$(t).find('td:eq(7)').text(a[0].bo);
$('#tbl_1').DataTable( {
dom: 'Bfrtip',
buttons: [
{
extend: 'print',
exportOptions: {
columns: ':visible'
}
},
'colvis'
],
// columnDefs: [ {
// targets: -1,
// visible: true
// } ]
} );
}
});