Wriiting to a Screen Table directly from localStorage

[mdsmith1]

Lets say I have a variable called "timestamp" in localStorage.

And say I have a screen table called "table1" with 3 rows.

And I would like to copy the "timestamp" variable from localStorage to the field EXTRA3 in "table1".

Is it possible to do that?

I always populate the screen tables with restore code the populates the entire table from the server with e.g. select * from Invoices01b ;

But I don't know how how to write to a single field.

Mike

[Paulo]

Hi @mdsmith1, if I'm understanding correctly, you would like the value of the localStorage key to be the value for a column on your table, for all rows.

Is that is the case, create a new column:

Give it a label, format, and for the value, reference the localStorage key you would like:

​

[mdsmith1]

Paulo:

I was not able to follow everything you put down but I did get something to work partially.

The screen capture below shows something I added in the Success handler off an app.

It correctly puts 900 into localStorage with the name mTest.

The app is working with a row counting variable called @i. If I put @i into the Value field, it puts the text "@i" into localStorage.

How to I put the value of @i into localStorage?

Mike

[Paulo]

It is hard to tell by just looking at the event handler. We need a bit more context to be able to help you achieve what you are trying to do.

1. When you say: "The screen capture below shows something I added in the Success handler off an app." Is this a success event handler for a query?
2. Is @i a variable defined within your query or outside of it?
3. What part of the previous post were you not able to follow?

Are you able to join us in Office Hours today or Thursday? It may be easier if we get to see you whole app.

[mdsmith1]

Paulo:

Let me explain this with 4 screen captures.

Screen 1
This shows the app with uses MySQL.

Screen 2
This shows my table (through cPanel) . The Value of @i is 370 at the end.

Screen 3
This shows the Success Handler to capture @i at the end of the app.

Screen 4
This shows how the Success Handler shows the result in localStorage.

Mike

Screen 1

Screen 2

Screen 3

Screen 4

[Paulo]

Thank you for expanding on this and adding the screenshots!

The "Value" input field on the event handler accepts text by default. To add a reference we defined, we must use the double curly bracket syntax: {{ reference }}. That being said, just adding {{@i}} won't work because the variable is defined within the scope of the query, but we are trying to access the value outside of it.

However, we do have access to queryName.data, which is the output of the query. It will just be a matter of accessing the value.

For example, given the following MySQL query:


I set up a variable @Total_Users that counts how many users I have on the table (3). The output of this query is what was selected, as we can see in the "State" tab:

In order to add the value of @Total_Users to "localStorage", I created an event handler to run when the query succeeds:

Where:

1. query1.data is the output of the query (an object with one key).
2. @Total_Users:=COUNT(*) is the name of the key, must use quotation marks in order to key into the query1.data object (JavaScript).
3. The value of the key from (2) is and Array and the element I need is the first element in the array, so we can use [0] to get the value.
   
   For reference:
   

I recommend looking at the output of your query on the "State" tab, and following the steps from above to create the event handler.

[mdsmith1]

Paulo:

I think there is a difference in what you are doing and what I am trying to do.

It appears that you are calculating the count of Total Users within the Internet Storage app.

I need to take a value calculated in the front end app and put that into storage.

I have attached some screens:

Screen 1
This shows the application.

Screen 2
This shows the result of @i which is 250

Screen 3
This shows the syntax in "Set local storage".

Screen 4
This shows the result with is "undefined".

My example may be calculated but in my real world case. I need to calculate "Taxes" that takes 20 lines of code. I need to calculate in the front end code and put that into storage.

Mike

Screen 1

Screen 2

Screen 3

Screen 4

[Paulo]

Could you share a screenshot of the "State" tab but for the query "Test02" instead of localStorage?

[mdsmith1]

Here is the screen capture. There is nothing under data.

Mike

[Paulo]

Could you click "Run" (top right of the query settings) and check again?

[mdsmith1]

Now it says @i = 0

"mTest" is still undefined.

Mike

[Paulo]

Great progress! We are almost there.

From the first screenshot, @i:=0 is the key in the data object. If you click where it says @i:=0 (on the "State" tab) we should be able to see the value of what was selected. "[] 1 item" means the value of this key is an array with one item in it. Could you show us what is there when you expand that key?

If inside the array (the value of @i:=0) we find the value we are trying to add to "localStorage", we would need to update the "Value" of the event handler as well.

Instead of {{Test02.data["@mTest:=@i"]}} we need {{Test02.data["@i:=0"][0]}}, where Test02.data is the object that we get as a response of the query, "@i:=0" is the key we are 'keying into,' and [0] is extracting the element at the index of 0 in the array.

[mdsmith1]

Paulo:

I appreciate the time you are spending with me.

I have changed the code as you have recommended and you can see ethe results in the screen below.

I have tried to get the second value of the array and it still says 0 when I think it should be 20.

I ran it again with the index at 0 and the answer is 0 but I need to be able to enter a different index value.

Mike

[Paulo]

From looking at this:

There is only one value for the key, and it is [0]. In other words, @i:=0 = [0] where @i:=0 is the key, and [0] is the value. We cannot access the index of 2 because there is only one element in the array, that is why you are getting undefined again.

This is because the query is running a SELECT @i=0, this is returning the value of @i when it is assigned (0).

Let's take a step back.

The query that you are running sets the value of the "f12" column in the "letter02" table. For each row, it sets the value of f12 to the current value of @i and then increments @i by 10. Essentially, it assigns consecutive values starting from 0 (the initial value of @i) to the "f12" column in the "letter02" table, with an increment of 10 for each row.

If I am understanding correctly, you would like to get the value of the variable after it has updated all rows. In the case of having 3 rows, that would be 20 (0 -> 10 -> 20).

If this is correct, we will need to create a new query that gets that value of "f12" from the last row, and then we can add it to localStorage.

If your table has an auto-incrementing primary key column, you can use that. Assuming you have a primary key column named id , the query would be:

SELECT f12 
FROM letter02 
ORDER BY id DESC 
LIMIT 1;

If you name this query "getLastF12", you could run this one on success of the "Test02" query. Then, on success of "getLastF12", we can add the event hander to "Set local storage", and the value would just be {{getLastF12.data["f12"]}}.

[mdsmith1]

Paulo:

Thank you so much.

I got this to work in a real world example.

The first screen shows where I make the calculation of @TTax. Its not an array, it is a single value.

The primary key of Invoices01b is rownbr.

The second screen shows the result.

It works!!

Thank you so much. This is code that I will be able to use in many places.

I have marked this as the solution.

Mike

[Paulo]

You are welcome, Mike!

Thanks for sharing your use case.