JSON data not showing

cy930

Hello. my JSON data is not showing and I also have this Chrome console error: Uncaught type Error: Cannot read property 'style' of undefined jquery.dataTables.js:4243

I assume have a similar problem to this post: https://datatables.net/forums/discussion/12334/how-to-format-to-the-right-json-format-solved but I still can't get any result.

I also assume that I have a properly generated JSON data, which is the following shortened version:

[
     {
           "product" : "brioche",
           "supplier_name" : " ",
           "category" : " ",
           "unit_price" : "0.50",
           "retail_price" : "1.00",
     },
// more data
]

Here is my JS code which I tried to copy (from the link I pasted above) by following along the conversation:

$(document).ready(function() {
     $(#table_id).DataTable( {
         "sAjaxSource" : "../inv_ajax.php",
         "sAjaxDataProp" : "",
         "aoColumns" : [
                {"mData" : "product"},
                {"mData" : "supplier_name"},
                {"mData" : "category"},
                {"mData" : "unit_price"},
                {"mData" : "retail_price"},
           ]
     });
});

and finally my HTML:

...

<table id="table_id" class="table table-striped" cellspacing="0" width="100%">
                        <thead>
                            <tr>
                                <th>Product Name <br>
                                    Supplier Name
                                </th>
                                <th>Category</th>
                                <th>Unit Price</th>
                                <th>Retail Price</th>
                            </tr>
                        <thead>
                        <tfoot>
                            <tr>
                                <th>Product Name <br>
                                    Supplier Name
                                </th>
                                <th>Category</th>
                                <th>Unit Price</th>
                                <th>Retail Price</th>
                            </tr>
                        </tfoot>
                        <tbody>
                        </tbody>
                    </table>
...

please remember that my DataTables work and only the JSON data is not showing up. Thanks in advance!

allan

Your HTML defines four columns, but your columns array defines five. One of them contains an error :-)

Allan