IDBTransaction: error event
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
The error event is fired on IDBTransaction when a request returns an error and the event bubbles up to the transaction object.
Note: To handle all the ways a transaction can fail, consider listening for the abort event instead.
Syntax
Use the event name in methods like addEventListener(), or set an event handler property.
addEventListener("error", (event) => { }) onerror = (event) => { } Event type
A generic Event.
Bubbling
This event bubbles to IDBDatabase. The event.target property refers to the IDBTransaction object that bubbles up.
For more information, see Event bubbling.
Examples
This example opens a database and tries to add a record, listening for the error event for the add() operation (this will occur if, for example, a record with the given taskTitle already exists):
// Open the database const dBOpenRequest = window.indexedDB.open("toDoList", 4); dBOpenRequest.onupgradeneeded = (event) => { const db = event.target.result; // Create an objectStore for this database const objectStore = db.createObjectStore("toDoList", { keyPath: "taskTitle", }); // define what data items the objectStore will contain objectStore.createIndex("hours", "hours", { unique: false }); objectStore.createIndex("minutes", "minutes", { unique: false }); objectStore.createIndex("day", "day", { unique: false }); objectStore.createIndex("month", "month", { unique: false }); objectStore.createIndex("year", "year", { unique: false }); }; dBOpenRequest.onsuccess = (event) => { const db = dBOpenRequest.result; // open a read/write db transaction, ready for adding the data const transaction = db.transaction(["toDoList"], "readwrite"); transaction.addEventListener("error", () => { console.log(`Error adding new item: ${newItem.taskTitle}`); }); const objectStore = transaction.objectStore("toDoList"); const newItem = { taskTitle: "my task", hours: 10, minutes: 10, day: 10, month: "January", year: 2020, }; const objectStoreRequest = objectStore.add(newItem); }; The same example, using the onerror property instead of addEventListener():
// Open the database const dBOpenRequest = window.indexedDB.open("toDoList", 4); dBOpenRequest.onupgradeneeded = (event) => { const db = event.target.result; // Create an objectStore for this database const objectStore = db.createObjectStore("toDoList", { keyPath: "taskTitle", }); // define what data items the objectStore will contain objectStore.createIndex("hours", "hours", { unique: false }); objectStore.createIndex("minutes", "minutes", { unique: false }); objectStore.createIndex("day", "day", { unique: false }); objectStore.createIndex("month", "month", { unique: false }); objectStore.createIndex("year", "year", { unique: false }); }; dBOpenRequest.onsuccess = (event) => { const db = dBOpenRequest.result; // open a read/write db transaction, ready for adding the data const transaction = db.transaction(["toDoList"], "readwrite"); transaction.onerror = () => { console.log(`Error adding new item: ${newItem.taskTitle}`); }; const objectStore = transaction.objectStore("toDoList"); const newItem = { taskTitle: "my task", hours: 10, minutes: 10, day: 10, month: "January", year: 2020, }; const objectStoreRequest = objectStore.add(newItem); }; Specifications
| Specification |
|---|
| Indexed Database API 3.0> # eventdef-idbrequest-error> |
Browser compatibility
Loading…