Setting lists data from js?

[brave latch]

I have a list with data from store, the problem is even though on init i set the values in store it still throws error that says current item not defined. Is there any way to set lists value from js?

[fathom trench]

Hello! I'm SmithBot, your Appsmith support bot, ready to help you with your
programming needs. When working with lists in Appsmith, initializing and setting
values can usually be done using JavaScript. If you are encountering errors
stating that the current item is not defined, it's possible there's an issue
with how the values are being initialized or accessed. To better assist you,
please provide me with more details about how you are initializing the values in
the store and where you are accessing them, so I can provide you with a more
accurate solution. Meanwhile, here's a general approach to set a list’s value
from JS in Appsmith: 1. Define a new JS object or function that returns the
initial value you want to set. 2. Assign this value to a variable on the
Appsmith store (appsmith.store) or use it to initialize a widget's property
directly. 3. Use this variable in your list or bind it to the list items
property. Could you clarify if this is similar to how you are approaching the
problem, and can you share any code snippets that show how you are setting and
trying to access these values? If you don't find my response helpful, you can
request to speak to a human agent

[brave latch]

I have a js object, that has init function, that tries to initialize values in store for the lists:

export default {
async init () {
EditRouteStopsList = [];
// Editation init
await storeValue("CurrentStop", {
"id": 1,
"name": "Lidická",
"notificationPhone": {
"phone": "[phone]"
},
"position": {
"altitude": 400.25,
"latitude": 49.204117,
"longitude": 16.606525
}
});
await storeValue("CurrentRoute", {
"id": 1,
"name": "Lužánky",
"stopIds": [
1,
2,
3,
4
]
});
await storeValue("CurrentCar", {
"carAdminPhone": {
"phone": "[phone]"
},
"defaultRouteId": 1,
"id": 1,
"name": "BAT-2022-01",
"platformHwId": 1,
"underTest": false
});
await storeValue("CurrentPlatform", {
"id": 1,
"name": "ABCD1234EF56"
});
await storeValue("RouteStops", [{
"id": 1,
"name": "Lidická",
"notificationPhone": {
"phone": "[phone]"
},
"position": {
"altitude": 400.25,
"latitude": 49.204117,
"longitude": 16.606525
}
}]);
}
}

Then I hae the list, in which i have this, I tried to use ternar if to be sure there are some values, it still returns errors tho:
{{appsmith.store.RouteStops.length > 0 ? appsmith.store.RouteStops : [{
"index": -1,
"id": -1,
"name": "",
"notificationPhone": {
"phone": ""
},
"position": {
"altitude": 0,
"latitude": 0,
"longitude": 0
}
}]}}

The list component is called CreateRouteStopList and in it are CreateRouteStopContainer and it gives error:
CreateRouteStopContainer
:
currentItem is not defined

[fathom trench]

It appears that your initialization script and the list component setup are
mostly correct. However, there could be a timing issue if your list is trying to
access the store values before the init function has finished storing them,
especially because you are using await with storeValue, which is
asynchronous. To address this, you could try a couple of approaches: - Make sure
that the init function is called and completed before the list component
attempts to access the store values. You can do this by calling init when the
application is loaded and using a loader or a state variable to ensure the list
is rendered only after the initialization is complete. - As a temporary
workaround for debugging purposes, you could insert hardcoded default values for
testing if the list component works with non-asynchronous values. Lastly, make
sure the EditRouteStopsList = []; line is not causing an issue since it's not
using let or const to declare the variable and isn't stored anywhere. If
it's meant to be a temporary variable or placeholder, ensure that it's declared
properly and in the right scope. If the issue persists and you suspect it might
be a bug or a timing problem with the Appsmith platform itself, I would
recommend reaching out directly to the support team or checking if there is any
known issue related to this behavior. If you don't find my response helpful, you
can request to speak to a human agent

[brave latch]

How do i make sure that the component is loaded after the init (the init is already loaded on page load)

[fathom trench]

To ensure that the component loads after the init function, you can use
Appsmith's built-in functionality to set a loading state while the init
function is running, and then render the components only after the state
indicates that the loading is complete. Here's a general approach: 1. Create a
new store value to track the loading state. 2. Set this loading state to true
at the start of your init function. 3. Once all await storeValue promises in
your init function have resolved, set the loading state to false. 4. Use
this loading state in the visibility property of your list component to
conditionally render it. javascript export default { async init() { await storeValue("isLoading", true); // Your existing storeValue calls... // ... // After all storeValue operations are done, set the loading state to false await storeValue("isLoading", false); } } Now modify the visibility condition of
your CreateRouteStopList component: - Set the Visible property of the
component to appsmith.store.isLoading === false This way, the list component
will only appear after the init function is done executing. Remember to
initialize isLoading to true in the init function and then to false once
everything is loaded to avoid the list rendering prematurely. If you don't find
my response helpful, you can request to speak to a human agent