HTML5:  Add redord to indexeddb

Posted on 2014-11-24
Medium Priority
Last Modified: 2014-12-02
Hi All,

I have the following code snippet that creates an IndexedDB and adds three records.

<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript">
var request = indexedDB.open("library");

request.onupgradeneeded = function() {
  // The database did not previously exist, so create object stores and indexes.
  var db = request.result;
  var store = db.createObjectStore("books", {keyPath: "isbn"});
  var titleIndex = store.createIndex("by_title", "title", {unique: true});
  var authorIndex = store.createIndex("by_author", "author");

  // Populate with initial data.
  store.put({title: "Quarry Memories", author: "Fred", isbn: 123456});
  store.put({title: "Water Buffaloes", author: "Fred", isbn: 234567});
  store.put({title: "Bedrock Nights", author: "Barney", isbn: 345678});

request.onsuccess = function() {
  db = request.result;

// <delete database>
//	window.indexedDB.deleteDatabase('library');
// </delete database>

Open in new window

This woirks well.  However I want to create another HTML page that adds to the existing records?

Any suggestions?
Question by:detox1978
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
LVL 10

Expert Comment

by:Hans Langer
ID: 40463086
if your new page its in the same subdomain/domain then you can just use the same code and insert records.

just create the db and then insert data with something like:

db = indexedDB.open("library");

var tx = window.db.transaction(['books'],"readwrite").objectStore('books');      

Open in new window


Author Comment

ID: 40464035
Sorry I'm new to this.  Where do I add the the record data?

  // Populate with initial data.
  store.put({title: "Quarry Memories", author: "Fred", isbn: 123456});
  store.put({title: "Water Buffaloes", author: "Fred", isbn: 234567});
  store.put({title: "Bedrock Nights", author: "Barney", isbn: 345678});

Open in new window

LVL 10

Accepted Solution

Hans Langer earned 2000 total points
ID: 40464756
just replace jsonObject with your object and the idrow with the ID that will make unique that row (like ISBN).

window.db = indexedDB.open("library"); //You can open the db and defined at the global scope so you can access to the db from any function without need to open it again. It will be opened until you close or refresh the page.

//This open a transaction to start operating in the "book" objectstore (its like a Table). 
var tx = window.db.transaction(['books'],"readwrite").objectStore('books');      

//Insert a row with your JSON data + the ID of the row
tx.add({title: "Quarry Memories", author: "Fred", isbn: 123456},123456);  

Open in new window

Success and Error listener are just necesary if you want to validate the data was inserted properly.

Look this article, its hows how to do it:

Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

There are a couple ways to attach a JavaScript function to dynamically created elements. You can make a new script for each element as it’s created or you can use delegation. Delegation allows a single script that is added at page creation to mat…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

741 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question