0

我正在尝试设置 jquery 数据表插件,但是,我遇到了砖墙。以下是我到目前为止所要做的......我创建了一个名为“testtable.php”的页面,以下是它的内容。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Cloudone Chart Of Accounts</title>

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

<script type="text/javascript" charset="utf-8">
            $(document).ready(function() {
    $('#example').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "server_processing.php"


    } );
} );

        </script>
        <link href="css/demo_table.css" rel="stylesheet" type="text/css" />
</head>

<body>
<table width="101%" border="0" class="display" id="example">
<thead>
  <tr>
    <th width="32%" scope="col">Rendering Engine;</th>
    <th width="28%" scope="col">&nbsp;</th>
    <th width="10%" scope="col">&nbsp;</th>
    <th width="10%" scope="col">&nbsp;</th>
    <th width="10%" scope="col">&nbsp;</th>
    <th width="10%" scope="col">&nbsp;</th>
  </tr>
  </thead>
  <tbody>
  <tr>
    <td>engine</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  </tbody>
</table>

</body>
</html>

使用 datatables.net 提供的示例,我创建了第二个页面,名为“server_processing.php”,填写了所需的连接设置,并将其与“testtable.php”一起放在测试服务器上。我正在使用 datatables.net 概述的基本配置,只是为了让事情启动并运行,这样我就可以玩一下以熟悉工作原理。这就是我难过的地方,我无法让页面呈现结果。我怀疑在连接中省略了某些内容以及定义要在显示页面“testtable.php”中显示的变量的过程。

谁能指出我误入歧途的地方或参考jquery数据表服务器端处理的逐步设置示例。

谢谢大卫

4

1 回答 1

0

让您在没有服务器端处理的情况下开始(如果您没有太多行应该没问题)

像现在一样创建您的 html 页面,用您的数据填充表格

所以:

<table width="101%" border="0" class="display" id="example">
    <thead>
        <tr>
            <th width="32%" scope="col">Rendering Engine;</th>
            <th width="28%" scope="col">&nbsp;</th>
            <th width="10%" scope="col">&nbsp;</th>
            <th width="10%" scope="col">&nbsp;</th>
            <th width="10%" scope="col">&nbsp;</th>
            <th width="10%" scope="col">&nbsp;</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>engine</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>engine1</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>engine1</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
    </tbody>
</table>

然后简单地初始化数据表,没有任何选项。

请参阅此示例:http: //jsfiddle.net/V97jd/

于 2013-02-24T15:09:52.713 回答