Обновление объектов хранилища

Метод put() интерфейса IDBObjectStore обновляет запись в базе данных или вставляет новую запись, если данный элемент еще не существует.

put(item)
put(item, key)

Первый параметр - item представляет значение, которое обновляется или добавляется в базу данных. Второй и необязательный параметр key представляет ключ, по которому надо обновить/добавить объект.

Метод put() возвращает объект IDBRequest. В случае успешного обновления/добавления у объекта IDBRequest вызывается событие success, а его свойство result будет содержать объект с указанным ключом. В случае ошибки генерируется событие error вместе с исключением типа DOMException. Для обработки этих событий можно использовать соответственно свойства onsuccess и onerror

Например, пусть хранилище users в базе данных test хранит следующие объекты:

[
    { name: "Tom", age: 39, id: 1},
    { name: "Bob", age: 43, id: 2},
    { name: "Sam", age: 28, id: 3}
]

Обновим объект в хранилище "users", у которого ключ равен 1:

const request = indexedDB.open("test", 5); // подключаемся к бд test

// при создании или изменении версии базы данных создаем в ней хранилище users
request.onupgradeneeded = (event) => { 
    const db = event.target.result;  // получаем бд
    // ключом является свойство id, и оно автоматически инкрементируется
    db.createObjectStore("users", { keyPath: "id", autoIncrement: true });
};
// при открытии базы данных изменяем в хранилище users 1 объект
request.onsuccess = (event) => { 
    const db = event.target.result;  // получаем бд
    const transaction = db.transaction(["users"], "readwrite"); // создаем транзакцию
    const userStore = transaction.objectStore("users");   // получаем хранилище users
    // получаем объект c id=1
    const getRequest = userStore.get(1);   
    getRequest.onsuccess = () => {
        const user = getRequest.result;
        console.log(user);
        // меняем значения свойств
        user.name = "Tomas";
        user.age = 22;
        // обновляем значения
        const updateRequest = userStore.put(user);
        updateRequest.onsuccess = () =>  console.log("Data successfully updated"); 
    };
    getRequest.onerror = (e) =>  console.log(e.target.error.message); // выводим сообщение об ошибке
};