Question

这将是我第一次在这里发帖。

请原谅我对编程的一点知识。我只是3周的练习，对PHP很新。我刚刚使用Netbeans开发了一个简单的CodeIgniter 3.x项目，大约在同一时间我正在练习PHP。我想使用here中的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世界，并且消息在控制台上按预期输出，style.css似乎也有效。

非常感谢任何解决方案，回应和见解！

谢谢!!!

好的，从我得到的回复中我终于设法让它工作了!!

我现在唯一的问题是修复分页按钮

他们看起来像这样：Pagination

知道如何修饰它吗？

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 个答案: