How i can store javascript array object saved somehow so that I can use it later [duplicate]

This question already has answers here: Javascript - Storing array of objects in hidden field (4 answers) Closed 4 years ago.

I have a situation like follows:

I have a id select page where user can select id from the shown ids on the page.When the user select the id i store them as a comma seperated value in a hidden input field.

      <input type="hidden" values="234,678,987" />

I have a button which on clicking pops up a dialog box which then displays the selected ids. The ids here shown I take from the hidden fie开发者_如何转开发ld. Now I have a requirement to store the product id and name.So probably in this case what should i do because now i can't be able to save this datastructure in hidden input field. Even if i use javascript array ,how can i save that array and use it future for displaying.Is it possible to save array object in hidden input field ....and retrieve it later as array object again...?

---

Here's a JSFiddle.

If you want to store the object in an input field, you can use JSON.stringify():

 //Pass your array (or JSON object) into JSON.stringify:
 JSON.stringify([{id:1, product_id: 2, name: 'stack'},
                 {id: 2, product_id: 2, name: 'overflow'}] )

which will yield:

 "[{"id":1,"product_id":2,"name":"stack"},{"id":2,"product_id":2,"name":"overflow"}]"

You can store this value in a hidden field (or a data attribute):

 <input type="hidden" id="project" value="[{'id':1,'product_id':2,'name':'stack"',{'id':2,'product_id':2,'name':'overflow'}]" />

Obviously, you can combine these steps (or do it through PHP / Rails / ...)

 $('#project').val(JSON.stringify([1,2,3]));

You can then decode this using, for instance, jQuery:

 $.parseJSON($('#project').val());

This should allow you to use the process you are using, but store Javascript objects in your input fields. Hope this helps!

---

You can

1. store the value in memory, using JS

   var arr = [];
   arr.push(your_value);
   

2. keep creating new attribute/values in the dom using JS
3. pass the value from page to page through the query string
4. store the value in a cookie to be retrieved again
5. store the value on the server (in a file/db) to retrieve again

---

Note:
Options 3 and 5 are only meaningful if you want to go to another page (on the site).
Options 4 and 5 are good if you want to close the browser and retrieve that info at a later point.

---

If you are not worried about IE7, you can use localStorage:

window.localStorage.setItem('myArray', JSON.stringify([234,678,987]));
// retrieve
var myArray = JSON.parse(window.localStorage.getItem('myArray'));

The JSON is supported by modern browsers. You can add it by including json2.

---

I assume you're talking about preserving the data after a new page has loaded. You can use your current approach of storing the data as a string in a hidden input, and then parse that string into a JavaScript object later. Another option is that your server-side code can produce some inline JavaScript declaring the JavaScript object you need. If you're using ASP.NET, for example, your page could have something like this:

// Assuming "serverSideIds" is declared as a List<string>

<% var serializer = new JavaScriptSerializer(); %>
var ids = <%= serializer.Serialize(serverSideIds) %>;