So I have an array stored in session storage that is constantly increasing, like adding items to a shopping cart, in this case its a music list. I have this displayed in a table format. My table is in a For Loop, for each iteration of the loop a Row is made consisting of the items properties(they are stored in the array in session storage), this being Title:, Artist:, Album:, Genre: and each item has a Edit and Remove button at the end of them. Basically I want the Remove button to be able to work. I want the Remove button to only remove that one Row/Item of the array, not the whole array. My array is stored with the Key[musicList] and the Value looks like the code below(its in a array):
[{title: "Rainbow", artist: "Jane", album: "SunnyBox", genre: "Melody"},…]
0: {title: "Rainbow", artist: "Jane", album: "SunnyBox", genre: "Melody"}
album: "SunnyBox"
artist: "Jane"
genre: "Melody"
title: "Rainbow"
1: {title: "Blue", artist: "Joe", album: "Azure Sea", genre: "Rock"}
2: {title: "Gear", artist: "Romero", album: "Basset", genre: "Metal"}
3: {title: "Amber", artist: "Amy", album: "Amy Coll", genre: "Soul pop"}
Here's a pic of the code in the browser. Music Table List in Browser
This is the part of the code that is supposed to remove the 1 item of the array, but its not working, since the array is also being updated with new items:
//This code is the Remove buttons EventListener
button2.addEventListener("click", function(){
let arrayOfMusic = JSON.parse(sessionStorage.getItem("musicList"));
arrayOfMusic.splice([i], 1);
sessionStorage.setItem('musicList',JSON.stringify(musicList));
})
Here is a pic of the rest of code pertaining to the Music Table. Music Table List JavaScript
Someone Please Help.
<button id="btn1">ClickMe</button>
<script>
sessionStorage.setItem("musicList", JSON.stringify([
{title: "Blue", artist: "Joe", album: "Azure Sea", genre: "Rock"},
{title: "Gear", artist: "Romero", album: "Basset", genre: "Metal"},
{title: "Amber", artist: "Amy", album: "Amy Coll", genre: "Soul pop"} ]));
document.write(sessionStorage.getItem("musicList"));
let button2=document.getElementById("btn1");
button2.addEventListener("click", ()=>{
let music=JSON.parse(sessionStorage.getItem("musicList"));
music=music.splice(1);
sessionStorage.setItem("musicList", JSON.stringify(music));
console.log(sessionStorage.getItem("musicList"));
})
</script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.