通过Ajax将Json对象转换为HTML Datatable

时间:2019-04-07 19:35:24

标签: javascript php json ajax datatables

我有一个PHP代码,它返回一个JSON对象,该对象实际上是一个数据数组,并且我想在数据表上显示JSON内容,但是我一直在遇到此错误: DataTables警告:表格ID =示例-无效的JSON响应 下面是PHP,HTML和JS,感谢您的帮助,谢谢。

PHP:

<?php
include "../config.php";
    $db = config::getConnexion();
    $sql = "SELECT * FROM  produits";
    $req = $db->prepare($sql);
    $req->execute();
    $liste = $req->fetchAll();

    //Convert Array to JSON Obj
    $someJSON = json_encode($liste);
    echo $someJSON;
    //var_dump($someJSON);

    ?>

HTML:

<table id="example" class="table table-striped table-bordered" style="width:100%">
    <thead>

    <tr>
        <th>nom</th>
        <th>num</th>
        <th>prix</th>
        <th>qte</th>
        <th>cat</th>
        <th>desc</th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <tr>
        <td ></td>
        <td ></td>
        <td ></td>
        <td ></td>
        <td ></td>
        <td ></td>
    </tr>
    </tbody>

    <tfoot>
    <tr>
        <th>nom</th>
        <th>num</th>
        <th>prix</th>
        <th>qte</th>
        <th>cat</th>
        <th>desc</th>
    </tr>
    </tfoot>
</table>


JavaScript:

<script type="text/javascript">
    $(document).ready(function() {
        $("#example").DataTable({
            ajax: {
                url: "TestAjax.php",
                dataSrc: ""
            },
            columns: [
                { data: "nom" },
                { data: "num" },
                { data: "prix" },
                { data: "qte" },
                { data: "descr" },
                { data: "cat" }
            ],
            iDisplayLength: 1,
            iDisplayStart: 0
        });
    });;

</script>

JSON数据:

[{"nom":"chaise1236","0":"chaise1236","num":"1231564658","1":"1231564658","prix":"800","2":"800","qte":"80","3":"80","descr":"description","4":"description","cat":"Interieur","5":"Interieur"},{"nom":"lilyouss","0":"lilyouss","num":"1231564672","1":"1231564672","prix":"5000","2":"5000","qte":"500","3":"500","descr":"youss","4":"youss","cat":"Exterieur","5":"Exterieur"},{"nom":"chaise125","0":"chaise125","num":"1231564660","1":"1231564660","prix":"500","2":"500","qte":"125","3":"125","descr":"descrchaise125","4":"descrchaise125","cat":"Exterieur","5":"Exterieur"},{"nom":"chaise3","0":"chaise3","num":"1231564661","1":"1231564661","prix":"125","2":"125","qte":"500","3":"500","descr":"descr3","4":"descr3","cat":"Interieur","5":"Interieur"},{"nom":"chaise5","0":"chaise5","num":"1231564662","1":"1231564662","prix":"1256","2":"1256","qte":"500","3":"500","descr":"descr55","4":"descr55","cat":"Exterieur","5":"Exterieur"},{"nom":"Fauteuil","0":"Fauteuil","num":"1231564663","1":"1231564663","prix":"550","2":"550","qte":"0","3":"0","descr":"Fauteuil Comfort","4":"Fauteuil Comfort","cat":"Interieur","5":"Interieur"},{"nom":"Fauteuil 2 Places","0":"Fauteuil 2 Places","num":"1231564664","1":"1231564664","prix":"2500","2":"2500","qte":"32","3":"32","descr":"faut Comfortable","4":"faut Comfortable","cat":"Interieur","5":"Interieur"},{"nom":"Tableau Artistique","0":"Tableau Artistique","num":"1231564665","1":"1231564665","prix":"5000","2":"5000","qte":"0","3":"0","descr":"tableau","4":"tableau","cat":"Interieur","5":"Interieur"},{"nom":"Table","0":"Table","num":"1231564667","1":"1231564667","prix":"230","2":"230","qte":"200","3":"200","descr":"Tbmx","4":"Tbmx","cat":"Interieur","5":"Interieur"},{"nom":"AspirateurAS","0":"AspirateurAS","num":"1231564668","1":"1231564668","prix":"125","2":"125","qte":"500","3":"500","descr":"Aspirateur Samsung","4":"Aspirateur Samsung","cat":"Interieur","5":"Interieur"},{"nom":"TableTs","0":"TableTs","num":"1231564669","1":"1231564669","prix":"500","2":"500","qte":"250","3":"250","descr":"Descr","4":"Descr","cat":"Interieur","5":"Interieur"},{"nom":"Prodtest","0":"Prodtest","num":"1231564671","1":"1231564671","prix":"500","2":"500","qte":"500","3":"500","descr":"description test","4":"description test","cat":"Interieur","5":"Interieur"}]

0 个答案:

没有答案