jquery basket how to hold data

Question

Im creating a small webshop. When I add products to my basket i simply add a data object to a div li this:

$("#ArticlesHolder").data('15', {name:'testname', nr:'4', price:'400', articlenr:'klr441234'});

This works great as long as i dont reload a page. My question is this, whats the best way in jquery to cache this data so i can reload the page, leave the page for 30 min and other stuff you can come up with. Is it to add a cookie to the users browser or does jquery have some other way to handle this? Thx for any help. By the way, if cookies is the solution, what happens if the user doesnt accept cookies??

EDIT

Would it be a good solution to try and use a cookie, if the user dosnt accept that, then make a ajax call to a webservice to handle it server-side and return json data?

FINAL EDIT

Ok, so I will use cookies. Now how do i store a JSON data in a cookie? as you can se in the above code line i may have many products with multiple values. Like this:

$("#ArticlesHolder").data('15', {name:'testname', nr:'4', price:'400',articlenr:'345345'});
$("#ArticlesHolder").data('25', {name:'name2', nr:'1', price:'100', articlenr:'kltt444'});
$("#ArticlesHolder").data('37', {name:'name3', nr:'14', price:'60', articlenr:'1235555'});

I some how need to loop thrue each data field and save it in a new JSON data type. Anyone know how this is done?

Best Regards Marthin

Answer 1

jQuery is javascript.

This means you are limited inside the current page view.

To persist data to the website, you can either

• Use Sessions, but you need a server side language like php, asp, ruby, etc..
• store cookies (if the user does not accept you can do nothing ..)
• Use HTML5 localStorage, but browser support is limited
• combination of the above.

Answer 2

Cookies would be a solution, but keep in mind that with every new page load the info stored in the cookie is also send to the server.

If the user does not accept cookies. This will not work at all.

A much nicer solution will be waiting for us in the future with HTML5 web storage.

Answer 3

A full page load is inherently going to "reset" your javascript. The browser will not hold javascript state between page loads. Your options are to create a cookie or to hold this information in server state. This is pretty much the classic issue of a stateless web, it just won't remember.

I suggest using a cookie in conjunction with storing this cache on the server side.

Answer 4

You would have to use a cookie and a server side solution of If you'd like you use localStorage I'd go with Lawnchair.

http://blog.westcoastlogic.com/lawnchair/

It's pretty sweet.