HTML5 Offline Storage / Web SQL

Question

I was asked to explore the parameters of offline storage for web forms on mobile devices (basically, the registration forms on the iPad for use at large events, where due to the huge amount and connectivity it always seems to be a problem).

What I would like to come up with is something like:

• A form that can send data when connected or store offline if not.
• Check your connection periodically and submit the form data whenever you can.

Can someone point me in the right direction?

Thanks,

Chris

Answer 1

Looks like you just need key / value pairs. window.localStorage is your friend!

This is a key / value repository that is saved when the page is refreshed and on all pages in the same domain (for example: run window.localStorage.userName = "John Doe"; somewhere on "http://www.somedomain.com/index. html ", and then when the user goes to" http://www.somedomain.com/page2.html ", if you run" window.localStorage.userName ", it will still return" John Doe ".

Let me know if you need snippets of code.

Answer 2

You can use html 5 indexedDB API - http://nparashuram.com/IndexedDB API.

The HTML5 WebSQL API is no longer in active maintenance, and IndexedDB seems to be all it uses.

You can use IndexedDB-WebSQL polyfill - http://axemclion.github.com/IndexedDBShim to make it work on mobile devices besides the desktop.

Answer 3

http://diveintohtml5.info will give you some good examples of using offline storage. if you are checking if you have any kind of connection, then you probably have to do something with XMLHttpRequest in the background or in the submit form, and then use the standard HTTP GET or POST method when submitting your form.