datatable.rows.add(response.data) showing message "No Data Available In Table"

anandkrishnan192@gmail.com

I have initialize datatable on $(document).ready(), below is the initialization code
var dtful = $('#MyNewTable').DataTable({
"order": [[1, "asc"]],
"lengthMenu": [
[10, 25, 50, 100, -1],
[10, 25, 50, 100, "All"]
],
language: {
search: "INPUT",
searchPlaceholder: "Search...",
infoFiltered: ""
},
"sDom": 'Rfrtlip',
"columnDefs": [

    ],
    "columns": [
        { "data": Name"autowidth": true },           
        { "data": "Salary", "autowidth": true },           
        { "data": "Position", "autowidth": true }, 
        { "data": "Comments", "autowidth": true },
    ]
});

-on click event using ajax call try to populate datatable, belowis the code to populate data
dtful.clear();
dtful.rows.add(response.data);
dtful.draw();

Data will get populated successfully but for 2 seconds it is displaying "No Data Available In Table " message.
I tried to find a solution but didn't get any solution,
please provide some solution

Thanks in advance

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin