Data table render the records in table but still shows that no data available in table.

kavitaneharkar

I have used datatable in angular 6 application . For some module it works fine but some time it render the available data in table still shows that no data available in table. And also when I export excel data it shows only header no records found. Please help me to get out of this issue.
Thank you.

colin

Hi @kavitaneharkar ,

Is there is data and it's being filtered, you can check the status at the bottom, it would say something like "showing 0 or X records" - if it's not, then it would suggest there is no data, or perhaps you initialised the table before the Ajax data was returned.

We're happy to take a look, but it would help, as per the forum rules, if you could link to a running test case showing the issue so we can offer some help. 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

kavitaneharkar

Hi @colin ,

Thanks for your help!

I have temporarily hosted the application here - http://54.71.127.83:4200
Username: admin
Password: password

Once login, if you check "Class Details", "Batch Details" & "Subject Details" tabs, everything works perfect in datatable.

But if you go to "Student Details" tab, you will find the problem.
Add below filters at the top -
Select Year: 2018
Select Class: 1st
Select Batch: All Batches

If you see the datatable now, we can see 2 records. But at the bottom, it displays "Showing 0 to 0 of 0 entries". Because of this, the export also gives blank data.

Let me know if anything else is required.

Thanks again for your help!

colin

Hi @kavitaneharkar ,

The problem is because your data doesn't match your columns. This is how your columns are defined:

    "columns": [{
        "title": "First Name",
        "data": "firstName",
        "sTitle": "First Name",
        "mData": "firstName"
    }, {
        "title": "Last Name",
        "data": "lastName",
        "sTitle": "Last Name",
        "mData": "lastName"
    }, {
        "title": "Batch",
        "data": "batchId",
        "sTitle": "Batch",
        "mData": "batchId"
    }, {
        "title": "Class",
        "data": "classId",
        "sTitle": "Class",
        "mData": "classId"
    }, {}],

But your data looks like this:

{_id: "5b7a8d018a6def3b90704681", batchName: "B01", classId: "5b7a8ccf8a6def3b9070467d", year: "2018", __v: 0}

It looks like you're requesting the data for Batches, rather than the Student Details...

Cheers,

Colin