Utilizing IndexedDB for data storage

Hey there! I am currently working on storing three fields in an IndexedDB. When I view them in the browser, I see the names of each index - content, content2, and content3. However, only data is being saved into content3. Can you help me figure out why?

Below is the source code I am using:

<script type="text/javascript">
          var request = indexedDB.open("synker");
          var db;
          request.onupgradeneeded = function() {
          // The database did not previously exist, so create object stores and indexes.
          db = request.result;
          var store = db.createObjectStore("notes", {keyPath: "ID"});
          store.createIndex("content","content", { unique: false });
          store.createIndex("content2","content2", { unique: false });
          store.createIndex("content3","content3", { unique: false });
        };

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

        function addData(data)  {
            var tx = db.transaction("notes", "readwrite");
            var store = tx.objectStore("notes");
            store.put({content: data, ID:1});
            store.put({content2: data, ID:1});
            store.put({content3: data, ID:1});
        }

Answer №1

Storing data using the store.put function creates individual objects, each consisting of different properties. These properties make up an object collection. When working with indexes, they rely on the properties found in multiple objects.

If you aim to save a single object with several properties at once, it is recommended to utilize a single call to the store.put method.

function addData(data) {
  var tx = ...;
  var store = ...;

  // Utilize one store.put call to save all three properties within a single object.
  store.put({'content': data, 'content2': data, 'content3': data});
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The function Slice() does not function properly when used with two-dimensional arrays

I have been attempting to duplicate a 2D array by value using the slice() method in order to prevent any changes made to the new array from impacting the original. Oddly enough, it seems that this approach is effective with a 1-dimensional array but not wi ...

Getting the value of a hidden input field within a div by accessing the event.target that initiated the event in JavaScript

I am working with a set of li elements, each containing specific child elements structured like this: <li class="list"> <!--Parent--> <input type="hidden" id="id" value="3"> <!--Child 1--> <div class="cd-1">....</div ...

Steps to dynamically populate a datatable with JSON data by triggering a click event in jQuery

I am facing an issue with feeding JSON data into datatables when the search button is clicked. The JSON data structure is as follows: [ { "port_code":"BOM", "cont_details_id":"9", "price":"44.000", "cont_price":"500", "c ...

Tips for transferring express route handling to the subsequent middleware and bypassing the current block of code

Here's the current setup of my route handler in my express app: app.use('/', function(res, req, next) => { if (!authorised) next(); f1(); f2(); }); Is there a way to prevent f1() and f2() from running without adding conditional st ...

CSS footer element refuses to disappear

This sample application features a header, footer, and a content div that includes a table displaying various statistics of basketball players. One issue I encountered was with the footer when there were many entries in the table. This caused the footer t ...

coding with javascript and css

Essentially, I am trying to add padding specifically to the left side of this code snippet: if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("livesearch").innerHTML=xmlhttp.responseText; document.getElementById("live ...

Guide to accessing the content within an h1 tag with JavaScript

I currently have a setup with 3 pages: 2 of them are WordPress pages while the other page is a custom page template featuring a form. The first two pages were created using the wp-job manager plugin. The first page includes a dropdown menu with a list of a ...

Introduce a timeout in the ajax request

I'm currently facing an issue with adding a 2-second delay between the loader icon and the success message displaying the data as html. I attempted to use setTimeout in my ajax code with a specified delay number, but it doesn't seem to be workin ...

Tips on saving checklist values as an array within an object using AngularJS

I need help with storing selected checklist items as an array in a separate object. I want to only store the names of the checklist items, but I am struggling to figure out how to achieve this. Below is the HTML code: <div ng-app="editorApp" ng-contro ...

Using the event object in the onClick handler within React applications

In my React app, I have implemented a feature where clicking on a column heading sorts the data in the table using merge sort algorithm My goal is to pass both the data (an array of objects) and the event object to the sorting function. However, I am faci ...

What is the best way to animate elements so that they move in a circular motion?

My goal is to recreate the image shown in the picture: https://i.sstatic.net/z08II.jpg In case the image is blocked, you can view it here: https://i.sstatic.net/YYg4J.jpg The picture appears to have only one icon visible, but there are actually 4 icons. ...

Implementing Twitter Login with Vue, Vuex, and Firebase

Exploring a Twitter login option for my sports social media dashboard project, I followed a helpful tutorial. While I've successfully implemented the HelloWorld component and retained the app.vue and main.js components, I encountered an error stating ...

Subscriber client successfully activated and operational via the command line interface

I have incorporated a script into my PHP file that reads the Pusher channel and performs various actions when a new event occurs on the specified channel. If I access the following URL in my browser: http:/localhost/pusher.php and keep it open, the p ...

Sharing a Detailed Mongoose Schema

Hey there! So, I've been working on this Mongoose Schema and there seems to be something off about it. The main area of concern is the "region" part. const mongoose = require('mongoose'); const destination = new mongoose.Schema({ ...

Calculate the occurrences of numbers within a string in an array of objects containing a specific string each time an object is removed

I am facing an issue where I need to re-number strings based on their type, regardless of their previous number. For example, if I delete Oranges 2 from [Oranges 1, Oranges 2, Oranges 3], it should become [Oranges 1, Oranges 2]. This means the numbers shou ...

Issue: The specific module is unable to be located, specifically on the Heroku platform

While my application performs well locally and on a Travis CI build server, it encounters issues when deployed on Heroku. The error message Error: Cannot find module is displayed, leading to app crashes. Here are some details about the npm module: It r ...

Can you please guide me on how to convert pug (jade) to html using npm scripts?

Struggling to construct my package.json file, I find myself facing a challenge when it comes to writing scripts. "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "build-css":"node-sass --output-style compressed -o bu ...

Is there a way to update and save both dependencies and devDependencies with a single command in Npm?

Is there a way to update multiple npm dependencies and save them to their respective locations in the package.json file? This is what my package.json looks like: { "dependencies": { "gulp": "^3.0.0" }, "devDependencies": { "gulp-eslint" ...

Sending KeyValuePair or IDictionary as payload to Web Api Controller using JavaScript

In my web api controller, I am trying to post two parameters: a flat int ID and an IDictionary (or similar equivalent). [HttpPost] public void DoStuff(int id, [FromBody]IDictionary<int, int> things) { } var things = new Array(); things.push({ 1: 10 ...

What is the best way to right-align a label in a vertical MUI Slider in ReactJS?

I am currently working with ReactJS/TS and MUI (Material-UI) to develop a vertical slider that requires the label to be positioned on the right side. By default, MUI places the label on the left for vertical sliders. I have reviewed the API documentation e ...