HTML Indexeddb Update

Last Updated:

HTML Indexeddb Update

In the following example, We will update a value (where id=0001) in the table ('MyTableName') under the database ('MyDatabase').

Example

HTML Online Editor
<!DOCTYPE html> <html> <body> <p id="point"></p> <script> var x = document.getElementById("point"); var indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB || window.shimIndexedDB; var open = indexedDB.open("MyDatabase", 1);open.onupgradeneeded = function(){ var db = open.result; var store = db.createObjectStore("MyTableName", {keyPath: "id"}); var index = store.createIndex("NameIndex", ["name.last", "name.first"]); }; open.onsuccess = function(){ // Start a new transaction var db = open.result; var tx = db.transaction("MyTableName", "readwrite"); var store = tx.objectStore("MyTableName"); var index = store.index("NameIndex"); // Add some data store.put({id: 0001, name: {first: "Brenden", last: "Eich"}, age: 58}); store.put({id: 0002, name: {first: "Dennis", last: "Ritchie"}, age: 70}); // Update store.put({id: 0001, name: {first: "Bjarne", last: "Stroustrup"}, age: 67}); // Query the data var getEich = store.get(0001); var getRitchie = index.get(["Ritchie", "Dennis"]); getEich.onsuccess = function(){ x.innerHTML += getEich.result.name.first +"<br>"; }; getRitchie.onsuccess = function(){ x.innerHTML += getRitchie.result.name.first; // => "Bob" }; // Close the db when the transaction is done tx.oncomplete = function(){ db.close(); }; } </script> </body> </html>

Browser Support

Devicedesktopmobile
Browsergoogle chromesafarifirefoxinternet Exploreredgeoperagoogle chromesafarifirefoxedgeoperaandroid webviewsamsung internet
indexeddbYesYesYesYesYesYesYesYesYesYesYesYesYes

Share this Page

Meet the Author