Loading forever

jerlabor

Datatables wont show any data, only the "loading..."

$('#storeTarget').DataTable({
    ajax: '/store-visit/targets',
    columns: [
        {data: 'month'},
        {data: 'year'},
        {data: 'num_of_stores'},
        {data: 'created_at'},
        {data: 'month'},
    ]   
});

//Json Response

{
"draw": 0,
"recordsTotal": 2,
"recordsFiltered": 2,
"data": [
{
"month": "12",
"year": "2019",
"num_of_stores": "3",
"created_at": "2019-05-02 14:32:39"
},
{
"month": "6",
"year": "2020",
"num_of_stores": "3",
"created_at": "2019-05-02 14:41:01"
}
],
"input": []
}

\\HTML code

<table class="table responsive" id="storeTarget">
                <thead class="table__thead">
                    <tr>
                        <th class="table__th">Month</th>
                        <th class="table__th">Year</th>
                        <th class="table__th"># of Stores</th>
                        <th class="table__th">Created At</th>
                        <th class="table__th">Action</th>
                    </tr>
                </thead>
                    <tbody class="table__tbody"></tbody>
                </table>

colin

Hi @jerlabor ,

It works here with the data in a variable, so that side is fine. Are you able to modify that to demonstrate the problem or link to your page?

Cheers,

Colin

kthorngren

Look at your browser's console for errors. Verify the JSON response in the Developer Tools > Network tab.

Kevin

Barbarosa

I was able to solve this problem by adding this to my servlet that is providing the data for populating my table:

        /***** Set Response Header *****/
        response.setHeader("Access-Control-Allow-Origin", "*");