JQuery Datatable插件在CodeIgniter 3.x中無法正常工作
[英]JQuery Datatable plugin doesn't work correctly in CodeIgniter 3.x
問題描述
這是我第一次在這里發布。
請原諒我對編程的一點知識。 經過3個星期的練習，我對PHP還是很陌生。 我剛剛在使用Netbeans進行一個簡單的CodeIgniter 3.x項目，而我正在練習PHP。 我想從這里使用JQuery Datatable插件輸出一個簡單的數據表。 我認為我已經正確地遵循了那里發布的簡單“您的第一個數據表”示例。 雖然我不明白為什么我的代碼無法正常工作。
這是我的index.php，即視圖：
<html> <head> <title> Employee Database </title> <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>css/datatable-bootstrap.min.css" media="screen"> <script type="text/javascript" src="<?php echo base_url(); ?>js/jquery-3.2.1.js"></script> <script type="text/javascript" src="<?php echo base_url(); ?>js/datatable.jquery.min.js"></script> <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>css/style.css"> <script src="<?php echo base_url(); ?>js/index.js"></script> </head> <body> <header> <center> <h1> Employee DB </h1> </center> </header> <center> <table class="table table-bordered"> <thead> <tr> <th> Employee Code </th> <th> Employee Description </th> <th> Employment Date </th> <th> Dept. Code </th> <th> Dept. Description </th> </tr> </thead> <?php foreach ($results as $results_item): ?> <tbody> <tr> <td> <?php echo $results_item['empcode']; ?> </td> <td> <?php echo $results_item['empdesc']; ?> </td> <td> <?php echo $results_item['empdate']; ?> </td> <td> <?php echo $results_item['deptcode']; ?> </td> <td> <?php echo $results_item['deptdesc']; ?> </td> </tr> </tbody> <?php endforeach; ?> </table> <div id="paging-first-datatable"></div> <!--<?php //var_dump($results);?>--> </center> </body> </html>
這是我的index.js：
$('#first-datatable-output table').datatable({ pageSize: 10, sort: [true, true, true, true, true], filters: [true, true, true, true, true], filterText: 'What do you wish to find?' });
它似乎不起作用。 我得到的唯一輸出就是沒有分頁的完整表。 我在index.js javascript上進行console.log，以檢查是否已使用簡單的hello world正確鏈接了它們，並且消息確實按預期在控制台上輸出，style.css似乎也可以工作。
任何解決方案，響應和見解均深表感謝！
謝謝！！！
好吧，從我得到的答復中，我終於設法使它開始工作！
我現在唯一的問題是固定分頁按鈕
他們看起來像這樣： 分頁
知道如何修飾它嗎？
1 個解決方案
解決方案1
0 已采納 2017-07-18 07:32:35
在foreach循環中有表格主體標簽，該標簽將為您的每個結果輸出標簽。 您需要將它們放置在foreach之外。 更改此：
<?php foreach ($results as $results_item): ?>
<tbody>
<tr>
<td>
<?php echo $results_item['empcode']; ?>
</td>
<td>
<?php echo $results_item['empdesc']; ?>
</td>
<td>
<?php echo $results_item['empdate']; ?>
</td>
<td>
<?php echo $results_item['deptcode']; ?>
</td>
<td>
<?php echo $results_item['deptdesc']; ?>
</td>
</tr>
</tbody>
<?php endforeach; ?>
到這個：
<tbody>
<?php foreach ($results as $results_item): ?>
<tr>
<td>
<?php echo $results_item['empcode']; ?>
</td>
<td>
<?php echo $results_item['empdesc']; ?>
</td>
<td>
<?php echo $results_item['empdate']; ?>
</td>
<td>
<?php echo $results_item['deptcode']; ?>
</td>
<td>
<?php echo $results_item['deptdesc']; ?>
</td>
</tr>
<?php endforeach; ?>
</tbody>
文檔指出標簽確實很重要。 試試這個，讓我知道！
閱讀文檔時，您也可以直接使用JS。 也許嘗試一下？
為您的index.js嘗試以下操作：
var datatable = new DataTable(document.querySelector('#first-datatable-output table'), {
pageSize: 10,
sort: [true, true, true, true, true],
filters: [true, true, true, true, true],
filterText: 'What do you wish to find?'
});
我檢查了文檔的源代碼。 他們將表放入id為first-datatable-output的div中。 您可以嘗試將<div id="first-datatable-output">放在<table class="table table-bordered"> ，將</div>放在<div id="paging-first-datatable"></div>
對於分頁，請嘗試將class="pagination-datatables text-center"到<div id="paging-first-datatable">例如<div id="paging-first-datatable" class="pagination-datatables text-center"> 。
真是的...他們的文件是baaaaaaaaad！
jQuery Validate插件在CodeIgniter中不起作用
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.