Web design pattern for a user modifiable list that persists across multiple form submissions and page updates?

Question

I'm working on a web application (bottle + beaker + jQuery ) where I'd like the user to have a somewhat modifiable list of items which persists across various form submissions and page updates. Clicking on an item in the list queries a database for information about that list item and this information can be updated by the user. I'd like the list to persist across querying/updating different list items. Also, as a convenience to the user, the list allows items to be "checked off" (or unchecked), say as they are processed or viewed.

I've gone over several different ways to accomplish this (e.g. update a hidden element in each form on the page and then use session management to update the working list on the server at every round trip; use Ajax to update the session variable each time an item on the list is checked or becomes the "active" list element), but none of them seem terribly satisfactory or elegant.

My question is is there a standard way of handling this sort of thing? Surely this is a fairly common requirement for similar web applications.

Answer 1

Further research on stackoverflow.com (these links were helpful:

How to differ sessions in browser-tabs?

Managing webapp session data/controller flow for multiple tabs )

along with some helpful discussions with a colleague gave an answer which should work on most modern browsers, namely using HTML5 local storage. Since the list mentioned in the original question is only relevant to that particular user session, there is no reason to even pass this information to the server. Using something like jStorage save the list locally every time the page is going to be refreshed and then retrieve it again using a predefined key on return. The only trick is how to maintain different working lists for different browser tabs or windows. You can't do this using sessions or cookies (these are shared by all tabs/windows); however, you can use javascript to set (or use, if already set) window.name. This saves you the trouble of passing a tab or windows ID as a GET variable with each roundtrip to the server, since you can use the window.name as the key under which the local list/data is stored.