数据表cdn无法使用我使用ajax从另一个页面调用的表。生成了新表,但它没有显示表中数据表的其他功能,只显示页面上的表。
我创建了一个带有按钮的页面,该按钮调用一个通过ajax刷新表的函数。我将cdn datatable链接和代码放在另一个页面上,直接打开时工作正常,但是当从ajax调用它时,它没有显示数据表cdn函数。而是显示整个表格。
$(function() {
$('#populate').click(function() {
$.ajax
({
type: "POST",
url: "getPurchaseInvoice.php",
data: $('#frm3').serialize(),
success: function(data)
{
$('.example').html(data);
}
});
});
});

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href=" https://cdn.datatables.net/buttons/1.5.1/css/buttons.dataTables.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<table style="width:100%" border="1" class="example" data-page-length="25">
<thead>
<tr>
<th>S.No</th>
<th>Invoice No.</th>
<th>Date</th>
<th>Name</th>
<th>Total Amount</th>
<th>Action</th>
</tr>
</thead>
<tbody>
while($row = mysql_fetch_assoc($rs)){
?>
<tr>
<td><?php echo $inc;?></td>
<td><?php echo $row['hrm_inv_no'];?></td>
<td><?php echo $row['fdate'];?></td>
<td><?php if($row['hrm_vendor_name'] != ''){ echo $row['hrm_vendor_name']; } else { echo "Other"; }?></td>
<?php /*?><td><?php echo $row['hrm_vendor_name'];?></td><?php */?>
<td><?php echo $row['hrm_net_value'];?></td>
<td align="center"><a class="iframef" href="purchaseinvoice.php?actiontype=print&id=<?php echo $row['hrm_inv_no'];?>"><img src="images/print.png" alt="Print"></a> | <img id="itemdel" title="Delete" onclick="deletePos('<?php echo $row['hrm_inv_no'];?>')" src="images/b_drop.png" style="cursor:pointer" alt="Delete"></td>
</tr>
<?php $inc++;
}
/*header("Content-type: application/octet-stream");
header("Content-Disposition: attachment; filename=Purchase-Invoice-".date('Y-m-d').".xls");
header("Pragma: no-cache");
header("Expires: 0");
*/
?>
</tbody>
</table>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.1/js/dataTables.buttons.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.1/js/buttons.flash.min.js"></script>
<script type="text/javascript" src="tableexport/jszip.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.1/js/buttons.html5.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.1/js/buttons.print.min.js"></script>
<script type="text/javascript" src=""></script>
<script type="text/javascript">
$(document).ready(function() {
$('table.example').DataTable( {
dom: 'lBfrtip',
buttons: [
{
extend: 'excelHtml5',
text: 'Save Excel',
title: 'Purchase Invoice',
customize: function( xlsx ) {
var sheet = xlsx.xl.worksheets['sheet1.xml'];
$('row:first c', sheet).attr( 's', '42' );
}
},
{
extend: 'pdfHtml5',
text: 'Save Pdf',
title: 'Purchase Invoice'
}
]
} );
} );
</script>
<div id="purchaseInvoice">
<table style="width:100%" border="1" class="example" data-page-length="25">
<thead>
<tr>
<th>S.No</th>
<th>Invoice No.</th>
<th>Date</th>
<th>Name</th>
<th>Total Amount</th>
<th>Action</th>
</tr>
</thead>
</table>
</div>
&#13;
答案 0 :(得分:0)
如果我的理解是好的,你想加载一个包含Datatable的php页面,提供一些数据。
如果是这样,.load()方法应该是合适的。
$('.example').load( "getPurchaseInvoice.php", $('#frm3').serialize());