#javascript #jquery #arrays #local-storage #cart
Вопрос:
Я работаю с плагином корзины покупок, когда я добавляю товар в корзину, я проверяю, существует ли товар уже в корзине, а затем обновляю его количество вместо того, чтобы добавлять его снова. Все работает отлично, за исключением обновления количества. Я создал массив объектов и сохранил его в локальном хранилище, а затем распечатал в корзине. Я обновляю количество, но оно не работает.Всякий раз, когда я обновляю страницу. Вот cart.Js
var data = localStorage.getItem("cartItem");
var cartArray = data ? JSON.parse(data) : []; //array of cart Items data
var total = 0;
var shipping = 2;
$(".addToCart").click(function(){
var flag = 0;
//Get all data of item to be added
var id= $(this).data("id");
var price= $(this).data("price");
var image = $(this).data('image');
var name = $(this).data("name");
var quantity = $(this).data("quantity");
var availability = $(this).data("availability");
var weight = $(this).data("weight");
//check if cart is empty to remove empty cart view
if(cartArray.length === 0) {
$("#empty-cart").css("display","none");}
//Traverse the cart list to check if item already exists or not
var getItems = JSON.parse(localStorage.getItem('cartItem'));
$.map(getItems,function(item){
if (item.I == id){
item.Q;
console.log(item.Q)
var p = parseInt((item.P).replace("$",""));
total = p;
$("#cartList li").each(function(){
var i = $(this).find('.id').html();
if(i == id)
$(this).find('.quantity').val(item.Q);
})
flag = 1;
return false;
}
})
//Add new Item in cart
if(flag == 0){
var itemObj ={
I : id,
IMG : image,
N : name,
W : weight,
A : availability,
P : price,
Q : quantity,
}
cartArray.push(itemObj);
localStorage.setItem('cartItem',JSON.stringify(cartArray));
$("#cartList").prepend( "<li class='newItem'><p class='id'>" itemObj.I "</p><div class='picture'><img src='" itemObj.IMG "' ></div> <div class='details'><p class='name'>" itemObj.N "</p><span class='weight'>" itemObj.W "</span><span> /</span> <span class='avail'>" itemObj.A "</span><p class='price'>" itemObj.P "</p><a type='button' class='inc'> </a><input type='text' class='quantity' value=" itemObj.Q " ><a type='button' class='dec'>-</a></div> <a type='button' class='removeItem'><i class='fa fa-trash'></i></a></li>")
//increment in badge icon number when new item added in cart
var counterInc = parseInt($(".badge").html()) 1;
$(".badge").html(counterInc);
// Display shipping and total amonunt after adding items
$("#shipping_text, #total_amount_text, #checkout, #clear-cart").css("display","block");
// Total amount calculation while adding items in cart
var q = itemObj.Q;
var p = (itemObj.P).replace("$","");
total = q*p;
}
total = shipping;
shipping = 0;
$("#total_amount_text span").text("$" total "");
})
var getItems = JSON.parse(localStorage.getItem('cartItem'));
if(getItems){
$("#shipping_text, #total_amount_text, #checkout, #clear-cart").css("display","block");
$.map(getItems, function(item){
var newItem = ("<li class='newItem'><p class='id'>" item.I "</p><div class='picture'><img src='" item.IMG "' ></div> <div class='details'><p class='name'>" item.N "</p><span class='weight'>" item.W "</span><span> /</span> <span class='avail'>" item.A "</span><p class='price'>" item.P "</p><a type='button' class='inc'> </a><input type='text' class='quantity' value=" item.Q " ><a type='button' class='dec'>-</a></div> <a type='button' class='removeItem'><i class='fa fa-trash'></i></a></li>")
$("#cartList").prepend(newItem);
console.log(item.Q)
var q = item.Q;
var p = (item.P).replace("$","");
total = q*p;
})
total = shipping;
$("#total_amount_text span").text("$" total "");
}
Комментарии:
1. Можете ли вы предоставить рабочий образец? изолировать любой код, предназначенный для выполнения обновления, и включить некоторый HTML-код, который он может переключать, чтобы мы могли видеть, что он не работает? На данный момент я не могу быть уверен, что это ваш браузер, код или плагин и т. Д.