Making a date to my products so i can remove them via it

JavaScript
1

so im stuck…I have this assignment to add products to a shoppingcart and store them in local storage which i have done, but i use splice so if I have 2 similiar products it will remove the first one, which is kind of logical, but I think i need to have a date so my remove function knows.

i have a json file that looks like this:

 {
    "phones": [
        {
            "title": "iPhone X",
            "description": "Last years phone from Apple with a beautiful all display front.",
            "image": "iPhoneX.png",
            "price": 11495
        },{
            "title": "One Plus 5",
            "description": "Sleek and powerful smartphone from One Plus.",
            "image": "OnePlus5.png",
            "price": 4995
        },{
            "title": "Galaxy S8",
            "description": "Really cool edge to edge smartphone from Samsung.",
            "image": "SamsungS8.png",
            "price": 7990
        },{
            "title": "LG V30",
            "description": "Super nice and beautiful smartphone from LG.",
            "image": "LGV30.png",
            "price": 7495
        },{
            "title": "Honor 10",
            "description": "The phone is powered by Huawei's Kirin 970 chipset, 4 GB of RAM, 128 GB of storage.",
            "image": "honor-10.png",
            "price": 4190
        },{
            "title": "Huawei Mate 20 Pro",
            "description": "The Mate 20 Pro is sports a large, high-res OLED display with a notch at the top housing a face-recognition system.",
            "image": "huawei-mate-20-pro.png",
            "price": 9990
        },{
            "title": "iPhone XR",
            "description": "The iPhone XR is an affordable, yet still very capable alternative to the iPhone XS.",
            "image": "Iphone_xr.png",
            "price": 9490
        },{
            "title": "Microsoft Lumia 950",
            "description": "Lumia 950 is a premium phone made by Microsoft and running on Windows 10.",
            "image": "lumia-950.png",
            "price": 3496
        },{
            "title": "Samsung Galaxy S9 plus",
            "description": "Galaxy S9 is the company's flagship smartphone for 2018.",
            "image": "SAMSUNG-S9-Plus.png",
            "price": 8189
        },{
            "title": "Sony Xperia XZ3",
            "description": "XZ3 is a high-end Android flagship phone and with an OLED display.",
            "image": "sony-xperia-xz3.png",
            "price": 7990
        }
    ]
}

and my add function looks like this:

/* creating localstorage and storing products */
var shoppingCart = [];
var ulElement;

if(localStorage.shoppingCart) {
    shoppingCart = JSON.parse(localStorage.shoppingCart);
}

function addPhones(product) {  
    shoppingCart.push(product);
   
    var phoneArray = JSON.stringify(shoppingCart);
    localStorage.shoppingCart = phoneArray;
}

// adds products to cart page//
function initSite() {
    printProductsInCart();
    
}

/* here is a printProductsInCart function that I call in i initSite to count the sum of phones added */
function printProductsInCart() {
    document.getElementById("wrapperForAllPhones").innerHTML = ""
    document.getElementById("sumOfProducts").innerHTML = "Din varukorg är tom!" 
    
    var totalPrice = 0;
    var shoppingCartItems = JSON.parse(localStorage.shoppingCart);
    
    for(var i = 0; i < shoppingCartItems.length; i++) { 
        totalPrice += shoppingCartItems[i].price;
        
    }
    $('#sumOfProducts').text("Totalt pris: " + totalPrice + " kr");
    
    for (i = 0; i < shoppingCart.length; i++) {
        var createPhone = createPhoneCard(shoppingCart[i])
        document.getElementById("wrapperForAllPhones").appendChild(createPhone)
    }

}

/* deletProducts form cart page */ here is the delet products function :slight_smile:

function deletePhone(product) {
    shoppingCart.splice();
    if (localStorage.clickcount) {
        localStorage.clickcount = Number(localStorage.clickcount) - 1;
        document.querySelector(".number-of-orders").innerHTML = localStorage.clickcount;
    }
    //var tempShopingCart = []
    for (var i = 0; i < shoppingCart.length; i++) {
        
        if (product.title == shoppingCart[i].title) {
            shoppingCart.splice(i, 1)
            break;
        }
    }
    
    var phoneArray = JSON.stringify(shoppingCart);
    localStorage.shoppingCart = phoneArray;
    printProductsInCart();
}
2

Please format your code by wrapping them between ``` (three backticks). Also I didn’t see any remove function, what you have done already?

3

i have done it :slightly_smiling_face: please check it out !

4

So you want to put a date in your object when it is added to the shopping cart? Then when it’s time for remove you can remove the first added?

To create a date, just do new Date() when the object is added to the shopping cart. I will write some example code just to show how you could do:

shoppingCart.push({...product, dateInserted: new Date()});

In the deletePhone function you could sort by the dateInserted and remove the first one.

shoppingCart.sort((a, b) => a.date - b.date)
// then removes the first one

Note that I didn’t run any of this code, just to give you an idea.

1 Like
5

thank you i will try!