JQuery Datatable插件在CodeIgniter 3.x中无法正常工作

Question

这是我第一次在这里发布。

请原谅我对编程的一点知识。 经过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似乎也可以工作。

任何解决方案，响应和见解均深表感谢！

谢谢！！！

好吧，从我得到的答复中，我终于设法使它开始工作！

我现在唯一的问题是固定分页按钮

他们看起来像这样：分页

知道如何修饰它吗？

Answer 1

在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 Datatable插件在CodeIgniter 3.x中无法正常工作

问题描述

1 个解决方案

解决方案1
0 已采纳 2017-07-18 07:32:35

JQuery Datatable插件在CodeIgniter 3.x中无法正常工作

问题描述

1 个解决方案

解决方案1 0 已采纳 2017-07-18 07:32:35

解决方案1
0 已采纳 2017-07-18 07:32:35