1

我有一个数据库，我需要从中获取一些行，并将它们移动到数据表中。我已经达到了查询所需内容并将数据作为 JSON 返回的程度。不过，我似乎无法克服这一点；我收到一条错误消息，指出 JSON 格式不正确，我得到的最接近结果的是表中它自己的行上的一个字符，而 JSON 根本没有被解析。有什么明显的我做错了吗？还是我走错了方向？ 

<script>
    $(document).ready(function() {
        $(function (){
            $("#logForm").submit(function() {
                console.log("Sending " + $('#logForm').serialize());
                var logRequest = $.ajax({
                    url: 'logQuery.php',
                    type: 'get',
                    datatype: 'auto',
                    data: $('#logForm').serialize(),
                    success: function(logResponse) {
                        $('#DataTables_Table_0').dataTable( {
                            "bDestroy": true,
                            "bProcessing": true,
                            "bServerSide": true,
                            "aaData": logResponse
                        });
                    }
                });
                logRequest.fail(function(jqXHR, textStatus) {
                    console.log( "Request failed: " + textStatus);
                });
                return false;
            });
        });
    });
</script>

这是生成 json 的 PHP：

<?
$q = "SELECT src,dst,calldate,billsec,disposition FROM cdr WHERE calldate >= '$from' AND calldate <= '$to' ORDER BY calldate DESC LIMIT $limit";

$r = mysqli_query($con,$q);
$rowCount = mysqli_num_rows($r);
$n = 1;
while($row = mysqli_fetch_assoc($r)) {
    $resArr[] = $row;
    $n++;
}

echo json_encode($resArr);
?>

这是表格html：

<table class="table table-striped table-condensed table-bordered bootstrap-datatable datatable dataTable" id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info">
    <thead>
        <tr role="row">
            <th class="sorting" role="columnheader" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="From" style="width: 200px;">From</th>
            <th class="sorting" role="columnheader" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="To" style="width: 200px;">To</th>
            <th class="sorting" role="columnheader" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Date" style="width: 153px;">Date/Time</th>
            <th class="sorting" role="columnheader" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Duration" style="width: 157px;">Duration</th>
            <th class="sorting" role="columnheader" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Disposition" style="width: 157px;">Disposition</th>
            <th class="sorting" role="columnheader" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Detail" style="width: 317px;">Detail</th>
        </tr>
    </thead>
    <tbody role="alert" aria-live="polite" aria-relevant="all">
        <tr class="odd">
            <td class="center "></td>
            <td class="center "></td>
            <td class="center "></td>
            <td class="center "></td>
            <td class="center ">
                <span class="label label-success"></span>
            </td>
            <td class="center ">
                <a class="btn btn-success" href="#">
                    <i class="halflings-icon zoom-in halflings-icon"></i>           
                </a>
            </td>
        </tr>
        <tr class="even">
            <td class="center "></td>
            <td class="center "></td>
            <td class="center "></td>
            <td class="center "></td>
            <td class="center ">
                <span class="label"></span>
            </td>
            <td class="center ">
                <a class="btn btn-success" href="#">
                    <i class="halflings-icon zoom-in halflings-icon"></i>           
                </a>
            </td>
        </tr>
    </tbody>
</table>

下面是生成 json 的示例：

[{"src":"10062","dst":"18665551234","calldate":"2013-06-30 23:52:29","billsec":"14","disposition":"ANSWERED"},{"src":"10062","dst":"186655551234","calldate":"2013-06-30 23:51:53","billsec":"21","disposition":"ANSWERED"}]

如果我更好地理解数据表如何将 JSON 字符串中的字段映射到表行/列，这将对我有很大帮助——如果你能向我解释一下，我将非常感激！

4

1 回答 1

1

更新的 Javascript

$(document).ready(function() {
    $(function (){
        $("#logForm").submit(function() {
            console.log("Sending " + $('#logForm').serialize());
            var logRequest = $.ajax({
                url: 'logQuery.php',
                type: 'get',
                datatype: 'auto',
                data: $('#logForm').serialize(),
                success: function(logResponse) {
                    var datableObj = $('#DataTables_Table_0').dataTable( {
                        "bDestroy": true,
                        "bProcessing": true,
                        "bRetrieve": true,
                        "bServerSide": true
                    });
                    datableObj.fnAddData(logResponse);
                }
            });
            logRequest.fail(function(jqXHR, textStatus) {
                console.log( "Request failed: " + textStatus);
            });
            return false;
        });
    });
 });

对于 HTML 您可以将 TBODY 标记的 HTML 完全删除为带有返回数据的 Ajax 页面。您还可以删除附加属性，即除了在 TH 和 TABLE 标记中指定的 STYLE 属性

于 2013-07-04T10:26:55.220 回答