CODEWITHSUNDEEP
htmlindexeddb
Lucky
Lucky

Reputation: 425

How to retrieve the data from database using Indexed DB

I have an existed database. I'm trying to retrieve the data from database using indexedDB but i'm unable to get the data from database.

 var data = [];
    // creating or opening the database
    var db;
    var request = window.indexedDB.open("database");

    request.onerror = function(event) {
      console.log("error: ");
    };

    request.onsuccess = function(event) {
      db = request.result;
      console.log("success: "+ db);
    };

    request.onupgradeneeded = function(event) {
         var db = event.target.result;
         var objectStore = db.createObjectStore("Subject", {keyPath: "id"});
         for (var i in data) {
                 objectStore.add(data[i]);       
         }
    }


function readAll() {
    var objectStore = db.transaction("Subject").objectStore("Subject");
    console.log(objectStore);
    objectStore.openCursor().onsuccess = function(event) {
      var cursor = event.target.result;
      if (cursor) {
            alert("Name for id " + cursor.key + " is " + cursor.value.Subject);
            cursor.continue();
      }
      else {
            alert("No more entries!");
      }
    };      
}

Thanks in Advance.

Upvotes: 0

Views: 9098

Answers (2)

user3260861
user3260861

Reputation: 149

I did encountered the same error once. it occurs because at times the onSuccess is executed even before the result data is returned. So you should check if result data is empty.

To solve the issue try using oncomplete instead of onSuccess and also use Jquery indexedDB plugin. The plugin requires certin code changes but has more consistent implementation of indexedDB. See http://nparashuram.com/jquery-indexeddb/

Upvotes: 0

buley
buley

Reputation: 29308

You're pretty close.

var data = [];

I'll presume that you actually have some data somewhere, and that it indeed has an id attribute since you're specifying that as your index key e.g.

var data = [{id: 'foo' }, { id: 'bar' } ];

Now here:

var objectStore = db.createObjectStore("Subject", {keyPath: "id"});
for (var i in data) {
        objectStore.add(data[i]);       
}

(Careful with for..in and arrays)

I don't think you're actually adding any data here, which is one reason why you can't read it. To add data to an object store, try to first create a read/write transaction first and then get your reference to the object store and add your object.

var trans = db.transaction(["Subject"], "readwrite").objectStore("Subject");

Note the usage of an array as the first argument to transaction() and "readwrite" as the second param. (Some examples use the IDBTransaction.READ_WRITE constant but this doesn't seem to work with recent versions of Webkit.)

var objectStore = db.transaction("Subject").objectStore("Subject");

Try this instead:

var trans = db.transaction( [ "Subject" ] );
  , objectStore = trans.objectStore( "Subject" );
objectStore.openCursor( IDBKeyRange.lowerBound(0) ).onsuccess = function(event) {..}

Upvotes: 1

Related Questions