**Getting error -> Cannot read properties of undefined (reading 'length')**
Code is there on JSFiddle -> https://jsfiddle.net/gLt40fry/1/
I want display data from Airtable to Datatable using AJAX
var ajaxData = $.ajax({
method:'GET',
url:'localhost',
success:function(response){
ajaxData = response.records
console.log(ajaxData)
}
})
Datatable must show the content from Airtable API inside table. Table is using Datatable and the code is available on JSFiddle. https://jsfiddle.net/gLt40fry/1/
You are accessing data before it is loaded from API. Use Promise instead.
Add code implementation after api data is received.
https://jsfiddle.net/7c69k5rm/1/
Code:
var getData = () => {
return $.ajax({
method:'GET',
url:'https://api.airtable.com/v0/appcn5JFxBMUeiYzA/lab-report?api_key=keyqyBQVPg55QG4kA',
success:function(response){
ajaxData = response.records
// console.log(ajaxData)
}
});
}
getData().then(ajaxData => {
console.log(ajaxData.records);
var dataSet = [];
for (let i = 0; i < ajaxData.records.length; i++) {
var arr = [];
arr.push(ajaxData.records[i].fields.Date_of_Manufacturing);
arr.push(ajaxData.records[i].fields.Batch);
arr.push(ajaxData.records[i].fields.Product);
dataSet.push(arr);
}
console.log(dataSet);
});
remove records after ajaxData
for (let i = 0; i < ajaxData.length; i++) {
var arr = [];
arr.push(ajaxData[i].fields.Date_of_Manufacturing);
arr.push(ajaxData[i].fields.Batch);
arr.push(ajaxData[i].fields.Product);
dataSet.push(arr);
}