Indexed DB API

IndexedDB is an API for client-side storage of significant amounts of structured data and for high performance searches on this data using indexes.

This seems to be allot more supported than other offline storage options out there being available on the latest versions of Chrome, Firefox and IE

http://caniuse.com/indexeddb

A full working Demo is available here

This demo will allow you to add records and delete records to your internal storage.

All my code is available on github: https://github.com/glynrob/indexeddb

Connect to the database:

Here we attempt to make the initial connection to the database and another function to call this connection with a table name when we require it.

Inside openDB there are 3 states:

  • success – connection to the database was successful
  • error – conneciton failed for some reason
  • upgradedneeded – the version of the database in the browser is not current, so set the new parameters

Add Row:

We call getObjectStore to make the connection to the database with the table name.

Then call store.add(obj); to attempt to add the new data as a row to that table.

Delete Row:

We call getObjectStore to make the connection to the database with the table name.

Then call store.get(key); to attempt to get the row from that table.

Finally store.delete(key); to remove that row from the table.

Display All Rows:

We call getObjectStore to make the connection to the database with the table name.

To get all the rows you call store.openCursor(); to start at the beginning of the result list.

Then loop through all results getting each element with store.get(cursor.key); and cursor.continue(); to jump to the next record.

Everything else is normal javascript/jQuery that you can get your head around.

This is one of the best methods that seem to be available for offline storage of data.
Its is supported more than most and provides easy functions to execute commands.

There isn’t anything out there yet that can offer the same flexibility as server side storage and there may never be, so us developers have to use what we have available.

So in short I would recommend IndexedDB along with WebSQl jumping between which ones are supported on each browser.

Best solution is to use something like http://nparashuram.com/IndexedDBShim/ which is an IndexedDB-WebSql adapter.

Leave a Reply

Your email address will not be published. Required fields are marked *