Use HTML5 IndexedDB cursors to update existing records

The HTML5 IndexedDB is still in the working draft stage and not fully implemented in major Internet browsers yet. Nevertheless, I tried to use its asynchronous API to develop a Google Maps application. It took me a little while to figure out how to update an existing record in the IndexedDB database store. This can be done by opening a read-write cursor to the record to be updated. Then call the cursor update method to replace it with the new record.

An example Javascript code snippet is shown below.

try {

var objDb;    //the database to update

var store = 'myStore';    //the database store to update

var key = 88;    //the key of the existing record to update

var newRec = 'hello world';    //the new record

var objStore = null;

var objTrans = null;

var objCursor = null;

var objKeyRange = null;

//...etc...open the database....etc...

//open a read-write transaction

objTrans = objDb.transaction(store,_IDBTransaction.READ_WRITE);

//get the store

objStore = objTrans.objectStore(store);

//create a range from the key

objKeyRange = _IDBKeyRange.only(key);

//open a cursor of only the record to update

objCursor = objStore.openCursor(objKeyRange);

objCursor.onsuccess = function(evt){

  var cursor = evt.target.result;

  //do the update

  var objRequest = cursor.update(newRec);

  objRequest.onsuccess = function(ev){

    console.log('Success in updating record 88');

    };

  objRequest.onerror = function(ev){

    console.log('Error in updating record 88');

    };

  };

  objCursor.onerror = function(evt){

    console.log('Error in retrieving record 88');

  };

}

catch (e){

  console.log('Exception:'+e.message);

}