Created
May 2, 2018 01:50
-
-
Save ryandabler/41c458871cb6b64f599fb182ba88daba to your computer and use it in GitHub Desktop.
Working example of an IndexedDB implementation to handle transactions surrounding a fake invoice database
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const request = window.indexedDB.open("database", 1); | |
// Create schema | |
request.onupgradeneeded = event => { | |
const db = event.target.result; | |
const invoiceStore = db.createObjectStore("invoices", { keyPath: "invoiceId" }); | |
invoiceStore.createIndex("VendorIndex", "vendor"); | |
const itemStore = db.createObjectStore("invoice-items", { keyPath: ["invoiceId", "row"] }); | |
itemStore.createIndex("InvoiceIndex", "invoiceId"); | |
const fileStore = db.createObjectStore("attachments", { autoIncrement: true }); | |
fileStore.createIndex("InvoiceIndex", "invoiceId"); | |
}; | |
request.onsuccess = () => { | |
const db = request.result; | |
const transaction = db.transaction(["invoices", "invoice-items"], "readwrite"); | |
const invStore = transaction.objectStore("invoices"); | |
const itemStore = transaction.objectStore("invoice-items"); | |
const invIndex = invStore.index("VendorIndex"); | |
// Add data | |
invStore.add({invoiceId: "123", vendor: "Whirlpool", paid: false}); | |
itemStore.add({invoiceId: "123", row: "1", item: "Dish washer", cost: 1400}); | |
itemStore.add({invoiceId: "123", row: "2", item: "Labor", cost: 500}); | |
invStore.add({invoiceId: "580", vendor: "Whirlpool", paid: true}); | |
itemStore.add({invoiceId: "580", row: "1", item: "Rubber hose", cost: 20}); | |
// Update an item | |
itemStore.put({invoiceId: "123", row: "1", item: "Dish washer", cost: 1300}); | |
// Delete an item | |
itemStore.delete(["123", "2"]); | |
// Get an item by key | |
const getRequest = invStore.get("123"); | |
getRequest.onsuccess = () => { | |
console.log(getRequest.result); // {invoiceId: "123", vendor: "Whirlpool", paid: false} | |
}; | |
// Get an item by index | |
const getRequestIdx = invIndex.getAll("Whirlpool"); | |
getRequestIdx.onsuccess = () => { | |
console.log(getRequestIdx.result); // [ {invoiceId: "123", vendor: "Whirlpool", paid: false}, | |
}; // {invoiceId: "580", vendor: "Whirlpool", paid: true} ] | |
}; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment