MAMO EMIRU
MAMO EMIRU

Reputation: 142

Cannot read properties of undefined (reading 'mData')

I am using React JS to display a sortable and searchable HTML Table usually known as DataTable. and I am getting the data of the table from JSON data. but this error appears. There is no error if the table is hard coded but when the datas for the table was from json by using the map function of JS there an error like this: TypeError: Cannot read properties of undefined (reading 'mData') Is there any way to display DataTable with the datas of the table was provided by JSON data? Please help....

Upvotes: 2

Views: 5099

Answers (1)

Avneet Singh
Avneet Singh

Reputation: 55

There could be couple of reasons why it is unable to read data. Firstly, you can check if you have given correct path of json file and whether it has the data which you are trying to display by passing the reference inside columns. Secondly, make sure table header's count defined in your html is matching with columns specified in your DataTable. Also, make sure you have added all dataTable dependencies. Below is a very simple example that will display 2 columns - userId & userName.

$(document).ready(function(){
        var jsonData = [{"userID":"1","userName":"name1"}, 
        {"userID":"2","userName":"name2"},{"userID":"3","userName":"name3"}];
        $('#example').dataTable({
            data: jsonData,
            columns: [
                { data: 'userID' },
                { data: 'userName' }
            ]
        });
    });

Upvotes: 2

Related Questions