In my localStorage, I have an array called product_categories that contains various objects, each consisting of a string and a nested array of objects representing products belonging to each category.
Despite seeking help from Appery's support team on how to query this array based on attributes within the objects, I decided to organize the data by assigning each product to an array index corresponding to its category.
Currently, I am attempting to display this array of objects in a collapsible block on my page. Previously, I achieved similar functionality with data retrieved from an online database.
Now, using a separate service, my goal is simply to retrieve the array of objects from localStorage and display it in a collapsible block, grid, or list item where each array index creates a new item automatically.
Despite numerous attempts, I have been unsuccessful in mapping the data correctly. The items disappear upon loading the page, almost as if the mapped array has a length of 0.
Upon inspecting the page in Chrome, the localStorage variable holding the array appears valid, matching the format of other variables successfully displayed on the page.
The GenericService I am utilizing pulls the data from localStorage and maps it to the page upon success. However, despite following the same procedure, I am encountering difficulties.
If you find it useful, here is a link to the original Appery.io support page containing relevant images for reference: Appery Support Page
I would greatly appreciate your assistance as communication barriers often hinder progress when interacting with Appery.io's support team
*EDIT Please note that changing 'localStorage' to 'local storage' does not apply in the context of Appery's syntax.
var products = offlineProductList(); // Retrieve JSON array of products
var UniqueCats = $.unique(products.map(function (d) {
return d.category // Return distinct categories
}));
var product_categories = []; // Create an array to store category objects and respective products
for(var i=0;i<UniqueCats.length;i++){
var category_products = [];
for(var j=0;j<products.length;j++){
if(products[j].category == UniqueCats[i]){
category_products.push(products[j]);
}
}
var category = {"category":UniqueCats[i],"category_products":category_products};
product_categories.push(category);
}
localStorage.setItem('product_categories', JSON.stringify(product_categories));
Shown below is the code used to generate the 'array of objects'
I wish I could provide more information, but due to restrictions, further details are limited. Please feel free to engage if necessary.