HTML and CSS Reference
In-Depth Information
Creating new IndexedDBs
To k i c k t h i n g s To f y To u n e e d t To To p e n a n e w i n d e xe d d a t a b a s e .
Yo u ' l l u s e t h e r e t u r n v a l u e t o c r e a t e o b j e c t s t o r e s a n d h a n d l e
any errors, similar to Web SQL Database where you receive a
database object and then open the database.
However, with IndexedDB every process is a request. As with
Web SQL Database, all communication is asynchronous. It's
common to see the return value called request , so that's what
we'll use:
var request = indexedDB.open('videos');
request.onerror = function () {
console.log('failed to open indexedDB');
};
request.onsuccess = function (event) {
// handle version control
// then create a new object store
};
Now that the database is open, assuming there wasn't an error,
the onsuccess event will fire. Before we can create the new
object store we need to begin by doing two things:
Store the actual database handle, so we can perform trans-
actions to get and store data.
Set the version on the database; if there's no version, it
means the database has just been created for the first time
(and a version will need to be set as we'll see in the follow-
ing examples).
The success event handler passes along an event object much
like the event object you'd receive if you were listening for a
click event. Inside this event we find a property called target,
and inside of that is the result . The result contains—as I hope
you've guessed—the result of the particular function call. In this
specific case, the event.target.result contains the open data-
base handle to our “video” database.
So the onsuccess handler is updated as such:
var db = null;
request.onsuccess = function (event) {
// cache a copy of the database handle for the future
db = event.target.result;
 
Search WWH ::




Custom Search