在datatables.net中使用json返回的未定义值 [英] undefined values returned using json in datatables.net

查看:73
本文介绍了在datatables.net中使用json返回的未定义值的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

简介:我正在使用datatables.net中的ajax制作服务器端数据表,该表可以在以下位置找到: https://databasetable-net.000webhostapp.com/

Intro: I am making a server-side datatables using ajax in datatables.net that can be found below: https://databasetable-net.000webhostapp.com/

错误: 表中的数据返回为"undefined",而不是实际数据(单击上面的链接以查看).控制台或datatables dubug跟踪程序中没有错误,这就是我现在寻求帮助的原因.

Errors: The data in the table returns as 'undefined' instead of the actual data (click above link to see). There are no errors in the console or in the datatables dubug tracer which is why I am now seeking help.

Index.php

$(document).ready(function() {
    $('#example').DataTable( {
        "processing": true,
        "serverSide": true,
            "ajax": {
                "url": "server.php",
                "type": "POST"
            },
            "columns": [
                { "data" : "id"},
                { "data" : "first_name"},
                { "data" : "last_name"},
                { "data" : "position"},
                { "data" : "date"},
                { "data" : "updated"},
            ],
});
 }); 
$(document).ready(function(){ $.getJSON('server.php', function(data){
    var employee_data=''; 
    $.each(data, function(key,value){ 
    employee_data+='<tr>';
    employee_data+='<td>'+value.id+'</td>';
    employee_data+='<td>'+value.first_name+'</td>';
    employee_data+='<td>'+value.last_name+'</td>';
    employee_data+='<td>'+value.position+'</td>';
    employee_data+='<td>'+value.date+'</td>';
    employee_data+='<td>'+value.updated+'</td>';
 }); 
    $('#example').append(employee_data);
    }); 
}); 
  </script>

<table id="example" class="display" style="width:100%">
        <thead>
            <tr>
                <th>ID</th>
                <th>First name</th>
                <th>Last name</th>
                <th>Position</th>
                <th>Date</th>
                <th>Updated</th>
            </tr>
        </thead>
        <tfoot>
            <tr>
             <th>ID</th>
                <th>First name</th>
                <th>Last name</th>
                <th>Position</th>
                <th>Date</th>
                <th>Updated</th>
            </tr>
        </tfoot>
    </table>

<?php
$records = mysqli_query($con, "SELECT * FROM employees");
$totalData= $records->num_rows;
$totalFiltered=$totalData;
$data=array();
while ($row = mysqli_fetch_array($records)) { 
    $subdata=array();
    $subdata[]=$row[0]; //id
    $subdata[]=$row[1]; 
    $subdata[]=$row[2]; 
    $subdata[]=$row[3]; 
    $subdata[]=$row[4]; 
    $subdata[]=$row[5]; 
    $data[]=$subdata;
}

$requestData= $_REQUEST;
//https://www.datatables.net/forums/discussion/comment/94864/

$json_data = array(
                  "draw" => intval(isset($_GET['draw'])), 
                  "recordsTotal"    => intval( $totalData ), 
                  "recordsFiltered" => intval( $totalFiltered ),
                  "data"            => $data //How To Retrieve This Data
                 );

echo json_encode($json_data);  
?>

Server.php

$table = 'employees';

// Table's primary key
$primaryKey = 'id';

// Array of database columns which should be read and sent back to DataTables.
// The `db` parameter represents the column name in the database, while the `dt`
// parameter represents the DataTables column identifier. In this case simple
// indexes
$columns = array(
    array( 'db' => 'id', 'dt' => 0 ),
    array( 'db' => 'first_name', 'dt' => 1 ),
    array( 'db' => 'last_name',  'dt' => 2 ),
    array( 'db' => 'position',   'dt' => 3 ),
    array( 'db' => 'date',     'dt' => 4 ),
     array( 'db' => 'updated',     'dt' => 5 ),
);

// SQL server connection information
$sql_details = array(
    'user' => 'id3741634_username',
    'pass' => 'password',
    'db'   => 'id3741634_database',
    'host' => 'localhost'
);

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * If you just want to use the basic configuration for DataTables with PHP
 * server-side, there is no need to edit below this line.
 */

require( 'ssp.class.php' );

echo json_encode(
    SSP::simple( $_GET, $sql_details, $table, $primaryKey, $columns )
);

结论: Sorta类似于本文,但我没有使用stringify: JSON返回未定义值

Conclusion: Sorta like this article but I did not use stringify:JSON returning undefined values

我主要将本文用作代码的基础. https://datatables.net/examples/data_sources/server_side

I mostly used this article for the foundation of my code. https://datatables.net/examples/data_sources/server_side

我不确定如何解决此问题,而没有任何错误并且几乎没有JSON经验.我怀疑我的问题可能不大.请让我知道我是否可以进行任何更改以改善我的帖子.谢谢!

I am unsure how to go about this issue with no errors and little JSON experience. I suspect my issue maybe something minor. Please let me know if I can make any changes to improve my post. Thanks!

推荐答案

1)摆脱手动插入html的初始$.getJSON()调用.当将数据表与Ajax源数据一起使用时,需要让数据表构建html.因为这是您要插入的行(以及在<tfoot>之后之后的隐含<tbody> ),这也是有问题的.

1) Get rid of that initial $.getJSON() call manually inserting html. When you use datatables with ajax sourced data, you need to let datatables build the html. As it is you are inserting rows (and an implied <tbody> after the <tfoot>) which is also problematic.

2)包括初始$.getJSON()在内的ajax调用都返回0记录,以及空数组.这就是为什么所有单元格值都未定义的原因.这些行实际上不应该存在……但是无论如何,您的Server.php脚本不会返回任何行.

2) Your ajax calls including the initial $.getJSON() are all returning 0 records, and and empty array. That's why all of the cell values are undefined. those rows actually should not exist ... but regardless of that, your Server.php scripts is not returning any rows.

如果尝试更改左上角的Show XX Entries选择菜单,则会看到该表已正确更新了服务器端数据.注意它现在如何显示(正确) "No data available in table" .

If you try changing the Show XX Entries select menu at the top left corner and you will see the table get updated properly with server side data. Notice how it now shows (correctly) "No data available in table".

这篇关于在datatables.net中使用json返回的未定义值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆