Great tutorial⌠thanks @ben
But, if this is how Wappler intends for us to use this, it does not look like a very good UX. @patrick can you please look at Benâs tutorial and suggest.
@George Sorry for the late reply. This is the main point which I am concerned about. And from what I understand, this is THE code that makes session's keyed array work.
Also, another issue I have with this method is that Ben is using another Array and updating that in session. Can the same thing be done without using another Array, directly in the session, and using the UI picker?
A Session Variable is merely a container that holds a value for the duration of a session. This value can be singular or it can be in the form of an Array.
If you want to assign a single value to the Session Variable, then just assign the value as in 179.99
If you want the Session Variable to be an Array, then your value must be an array as in ["179.99","9.99"]
If you want the Session Variable to hold a Keyed Array, then the value will look like [{"product":"Los Angeles","qty":"1","price":"179.99"},{"product":"Cotton T-Shirt","qty":"1","price":"9.99"}]
The above examples show static values and in the case of a simple value, you can assign a dynamic value like {{price}}
If you want to assign an Array to the Session, then you could have something like [{{price[0]}},{{price[1]}}] (not sure if this will work, so treat this as theoretical)
The problem with this is that every time there is an modification to the array, you must code to facilitate this. Wappler makes it very easy to handle Arrays (I will not elaborate on this here), including Keyed Arrays.
So to answer your query, unless you want to code the whole thing yourself, it is best to use Wapplerâs Arrays to populate the Session Variable.
Thanks a lot ben. At this minute, Iâm literally following every word of your how-to guide on using session storage keyed array. They are soo valuable, very kind of you.
But, Iâm unable to make it work, either two things are possible - either iâm doing it wrong, or it could be a wappler bug. I have learnt it the hard way that there are lots of wappler bugs and if something doesnât work, I open the code view and see if the generated code doesnât make sense and fix it. But, everything looks good at my end, still not working.
I will share the error Iâm hitting and test page under the how-to guide on this topic Using Session Storage Keyed Array shortly⌠thanks again for helping the community out.
I made it work⌠yaayyy! Where I got stuck is between step 15 & step 16 in your how-to guide.
To display the data, I was binding my repeat to âitemsâ instead of âcartâ. Thanks to your guide.
A small feedback, under the session âcartâ object, probably rename âitemsâ to something like âmycartitemsâ as it can be confused with the âitemsâ keyword when binding with array components. Looks like we never refer to this âmycartitemsâ anywhere in the workflow, except may be when directly referring to the keyed arrays.
My next challenge to do the same for a complex keyed array like this
Just watched your updated youtube tutorials. Noticed that you have used âcartitemsâ instead of âitemsâ and also how different the bindings are (arrCart now binds to cart/cartitems) compared to the previous tutorials. Itâs more clear and easy understand, thanks @ben .
Any reason why you chose local storage instead of session storage?
Selfish. While creating the tutorial and while testing, I frequently had to shut the browser down and restart. Each time I would loose my session variables. With local storage, there was no such problem.
Thinking about it, local storage will enhance user experience if they came back to the browser after a day or so to find that their cart still exists.
Iâm quite familiar with your wCart tutorials using the Local Storage Manager (containing keyed array) & intermediary arrays to pass on and store the values into local storage manager.
Iâm trying to understand how is this new Data Store Component different from Local Storage Manager?
Data Store Component is an abstraction over the Local storage & Session storage manager
With the ability to insert, update, delete & clear data, the keyed array in your tutorial & intermediary arrays to pass on data are eliminated, making it damn simple to build similar functionality
Does this make the Local storage & Session storage components (under State Management) redundant, as itâs more efficient to use the data store?
No, it does not. Data store provides you with the options to have your data stored in a structured way, by defining a schema just like a database. It allows you to access, edit, delete specific items.
Local storage and session storage are still the way to go when you want to save a single value in a variable and reuse it across your pages. Also to cache your server connect results etc.
Having gone through Benâs awesome tutorial, I can truly appreciate the amazing ease the new Data Store component delivered. Kudos⌠thanks for the awesomeness @George