When it comes to mapping an object of arrays, my goal is to display the first row of content within a div after the mapping process. I am working with an object that contains multiple arrays from the database, but I am only focusing on mapping 2 out of the 4 arrays present.
The challenge lies in utilizing the mapped arrays to retrieve all corresponding data and present it within a div. The user should then be able to navigate through this data by clicking an up or down arrow. However, I am currently facing issues in displaying the next or previous set of data from the object. While the click function is correctly configured (and has been successful with test data), I suspect that the problem may lie in how I am mapping the arrays.
This is the original object retrieved from the database:
object: {
PageNum: [array of items],
RowNum: [array of items],
CustomerName: [array of items],
FacilityName: [array of items]
}
Here is how I am mapping the arrays:
var delDS = [{
pageNum : delPageData["PageNum"],
rowNum : delPageData["RowNum"]
}];
var delMappedArray = delDS.map(function(obj) {
var rObj = {};
rObj[obj.pageNum] = obj.rowNum;
return rObj;
});
As a result, the mapped data structure looks like this:
[object]
0: Object
2,2,4,4,6: Array(5)
0: "24"
1: "26"
2: "2"
3: "4"
4: "10"
length: 5