jQuery DataTable创建问题

时间:2012-05-21 18:29:32

标签: php javascript jquery datatable

我需要填充DIV容器,即使用jQuery DataTable创建一个表。问题是这个例子对我不起作用。而不是格式化的表我看到没有任何元素的jQuery DataTable插件的未格式化的表。

以下显示的php文件位于main/tables文件夹中,而所有脚本都位于main/scripts/media

那么,我的代码实际上有什么问题?

<?php
    include_once 'include/DatabaseConnector.php';
    $query2="SELECT * FROM resources;";
    $result2=DatabaseConnector::ExecuteQueryArray($query2);
?>

<script type="text/javascript" src="../scripts/media/js/jquery.dataTables.min.js"></script>
<script src="../scripts/media/js/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript" src="../scripts/media/js/complete.js"></script>
<script type="text/javascript" src="../scripts/media/jsjquery.dataTables.js"></script>
<script type="text/javascript" src="../scripts/media/js/jquery.dataTables.columnFilter.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('#example').dataTable();
} );
</script>

<div>
<h1>Employees</h1>

    <table width="100%">
        <tr>
            <td> 
                <div class="scrollbar">
                <table id="example" border="0" cellspacing="2" cellpadding="2" width = "100%">
                    <thead>
                    <tr>
                        <th scope="col">Reg</th>
                        <th scope="col">Title</th>
                        <th scope="col">Availability</th>
                        <th scope="col">Latitude</th>
                        <th scope="col">Longitude</th>
                        <th scope="col">Average Speed (km/h)</th>
                    </tr>
                    </thead>
                    <tbody>
                        <?php foreach ($result2 as $row):?>
                        <tr class="alternate">
                        <td><?php echo $row['resReg']; ?></td>
                        <td><?php echo $row['resTitle']; ?></td>
                        <td><?php echo $row['resAvailability'] ? 'Yes' : 'No';?></td>
                        <td><?php echo $row['resLatitude']; ?></td>
                        <td><?php echo $row['resLongitude']; ?></td>
                        <td><?php echo $row['resAvgSpeed']; ?></td>
                        </tr>
                        <?php endforeach;?>
                    </tbody>
                </table>
                </div>
            </td>
        </tr>
    </table>
</div>

2 个答案:

答案 0 :(得分:2)

您缺少css文件。添加它,你的问题应该解决。

答案 1 :(得分:0)

我认为您需要添加主jquery文件。等;

<script src="js/jquery-1.10.2.min.js"></script>

* jQuery UI与jQuery库文件不同。 并检查这两个文件是否重复。如果是这样,你只需要一个。

<script type="text/javascript" src="../scripts/media/js/jquery.dataTables.min.js"></script>

<script type="text/javascript" src="../scripts/media/jsjquery.dataTables.js"></script>