Delete the JSON object stored in local storage and reconstruct the array from scratch

I've encountered an issue with deleting an item from LocalStorage...here's the JSON data stored in LocalStorage.

{
"1461569942024" : 
{"t_id":1461569942024,"t_build_val":"PreBuild1","t_project_val":"18"},
"1461570048166" : 
{"t_id":1461570048166,"t_build_val":"PreBuild2","t_project_val":"17"}
}

This is what I attempted:

function removeItem(array, value) {
    var idx = array.indexOf(value);
    if (idx !== -1) {
        array.splice(idx, 1);
    }
    return array;
}

var newData = removeItem(localStorage['data'], '1461569942024');

I'm looking to delete an object based on its key, for example, 1461570048166, and then re-save the entire array to LocalStorage.

Thank you

Answer №1

Give this code a try

let data = {
    "1461569942024": {
        "t_id": 1461569942024,
        "t_build_val": "PreBuild1",
        "t_project_val": "18"
    },
    "1461570048166": {
        "t_id": 1461570048166,
        "t_build_val": "PreBuild2",
        "t_project_val": "17"
    }
};

function removeItem(obj, key) {
    delete obj[key];
    return obj;
}

localStorage.setItem("localData", JSON.stringify(data));

localStorage.setItem("localData", JSON.stringify(removeItem(JSON.parse(localStorage.getItem("localData")), '1461570048166')));

JSON.parse(localStorage.getItem("localData"));

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

Encountering issues with resolving dependencies in webdriverIO

I'm attempting to execute my WebdriverIo Specs using (npm run test-local) and encountering an error even though I have all the necessary dependencies listed in my package.json as shown below: [0-2] Error: Failed to create a session. Error forwardin ...

Updating the ghost image for HTML5 drag and drop functionality

I am facing an issue with a large div element that is too big for my liking. I have come up with a solution to change it by implementing the following code: <div draggable = "true" id = "ololo"> </div> var k = document.getElementById("ololo"); ...

Issue with Snackbar slide transition not functioning properly in mui 5

Transitioning from material-ui 4 to mui 5 has presented me with a challenge. Whenever I try to display my snackbar, an error pops up in the console. After some investigation, I realized that the issue lies within the Slide component that I'm using as ...

Create a horizontal scrolling div with a fixed position

Even though this topic has been discussed numerous times, I have not found any solutions that work for me. My webpage has a sidebar on the left with position:fixed in CSS, and I want it to scroll horizontally along with the rest of the content. For the he ...

Searching for two distinct nested key values in Ramda

I am new to Ramda and wondering if it is possible to retrieve two different key values at the same level of an object. Below is the code I have added: In this scenario, the object 'list' contains keywords 'users' and 'employee&ap ...

jQuery: A variety of ways to close a div tag

I am encountering some difficulties trying to make this work properly, any assistance would be highly appreciated. The goal is to have the div close when the user clicks the X button, as well as when they click outside of the wrapper container. Unfortuna ...

Why opt for ref.current over directly applying the condition?

I'm curious as to why the code uses if (ref.current && !ref.current.contains(event.target)) rather than if (!ref.current.contains(event.target) function useOutsideAlerter(ref) { useEffect(() => { // Function for click event function hand ...

Difficulty in detecting state changes without refreshing the component when using Redux and React

I'm encountering difficulties detecting state changes from my Redux reducer in a React application. When I modify the state within one component, the other component in the app does not get the update unless the component is reloaded or refreshed. Let ...

Developing a customized autosuggest feature using AJAX with comprehensive keyboard accessibility

Has anyone tried building their own AJAX auto suggest text box with full keyboard support? I've managed to create the auto suggest feature by connecting to a SQL DB and displaying results, but the only way to interact with the search results is throu ...

What is the technique for parsing parameters from a JSON endpoint URL in Ruby on Rails?

I've been grappling with this task for a few hours now. JSON format is new to me, and I'm unsure how to extract parameters from the URL sent to my endpoint API. Imagine this URL: /endpoint/name=anna&<a href="/cdn-cgi/l/email-protection" ...

Navigate to specific element from bootstrap navigation bar

I am in the process of creating a website for a small organization. The website is being constructed using bootstrap 4, and there is a navbar that connects to various flex-containers. I want these connections to smoothly scroll to their respective elements ...

What is the reason for restricting AJAX requests to the same domain?

I'm puzzled by the limitation of AJAX requests to the same domain. Can you explain the reasoning behind this restriction? I don't understand why requesting files from external locations is an issue, especially since servers making XMLHTTP reques ...

What is the best way to transform a class object into a JSON string using the Boost library in C++?

As a beginner in C++, I must apologize if my question seems too basic. I am working with the following files: POST1.h #ifndef POST1_HH #define POST1_HH #include <iostream> #include <boost/property_tree/ptree.hpp> #include <boost/property_ ...

Navigating to a different directory using Node.js and ExpressJS route mapping

I'm struggling with setting up routing using ui.router. This is the structure of my folders: https://i.stack.imgur.com/Fu0A9.png In the app.js file within the javascripts folder, I have the following code: var app = angular.module('testing&ap ...

Dealing with multiple POST requests at once in Node Express JS - Best Practices

I've been working on a Node project with Express to handle incoming GET/POST requests. I have set up routes to manage various types of requests. One specific route, /api/twitter/search, calls a function that uses promises to retrieve Twitter feeds and ...

JavaScript encountered an issue while parsing XML: the format is not well-formed

I keep seeing an error message saying "Error parsing XML: not well-formed" when I encounter this line in my javascript code: for (var i=1; i<=totalImgs; i++) If I remove the < character from the line, the parsing error goes away. However, the javas ...

Tips for deleting multiple uploaded images from an array using Vue.Js and updating the UI accordingly

I am currently utilizing VueJs to upload multiple images. I am saving their respective base64 values in an Array to store them in the database. I have also added a remove feature, so when the user clicks on the remove button, it finds the index of that ele ...

Tips on customizing the appearance of React rendering components

<div> <h3>{this.props.product.name}</h3> <h3>{this.props.product.code}</h3> {this.renderColors()} <article> <div da ...

Zooming does not activate the onZoom event

I have created a line chart using react-chartjs-2 and incorporated the chartjs-plugin-zoom plugin. My goal is to have the zoom level displayed in the console whenever the chart is zoomed in or out. However, it seems that the onZoom function is not being tr ...

JQuery not functioning properly within a dynamically loaded AJAX section

After loading some pages with Ajaxtabs, I encountered an issue where jQuery and Owl Carousel were not functioning properly. The classes and styles from Owl Carousel were not being applied to the divs after loading parts of the page. Here is an example of ...