[АнонимныйПарень]

Пишу "корзину" на php, jquery. Логика такая: на js при загрузке страницы кидаю на сервер ajax запрос, о том что нужно вывести из бд товары. Сервер понимает это, выбирает товары, запаковывает их в JSON и кидает на клиент. На клиенте я принимаю JSON данные и вывожу их на страничку. Если пользователь нажмет на цену, то js добавляет данные про этот товар в localStorage. Что-бы посмотреть купленный товар, нужно зайти на страничку "Корзина" и там я вытягиваю из localStorage эти данные. Вопрос: как положить эти данные в объект, который я ложу в localStorage. Дальше код, там будет понятнее:

var cart = {};

function init () {
	$.post(
		"../templates/core.php",
		{
			"action" : "init"
		},
		showGoods
	);
};

function showGoods (data) {
	data = JSON.parse(data);

/*	console.log(data);*/

	var out = '';

	for (var key in data) {
		out += '<div class="single_goods" style="padding-right: 0px; padding-left: 0px;">';
		out += '<b> ЗАМОК: ' + data[key].name + '</b>';
		out += `<img src="${data[key].image}">`; 
		out += '<p> Размер: ' + data[key].size + '</p>';
		out += '<p> Цвет: ' + data[key].color + '</p>';
		out += '<div class="btn-group" style="width: 100%;">';
		out += '<button type="button" class="btn btn-warning cost add" style="width: 100%; font-size: 1.7rem;" data-art="'+data[key].id+'"> Купить за: ' + data[key].cost +  '$</button>';
		out += '</div>';
		out += '</div>';
	}
	$('#goods').html(out);
	$('.add').on("click", addToCart);
};

function addToCart () {
	var articul = $(this).attr('data-art');

	if (cart[articul] != undefined) {
		cart[articul]++;
	}
	else {
		cart[articul] = 1;
	}

	localStorage.setItem('cart', JSON.stringify(cart));

	showCart();
};

function checkCart () {
	if (localStorage.getItem('cart') != null) {
		cart = JSON.parse(localStorage.getItem('cart'));
	}
};

function showCart () {
	var out = '';
	for (var w in cart) {
		out += '<span> ID товара: '+ w +'</span> <br>'+'<span> Кол-во товара: '+ cart[w] +'</span> <br> <span> Название:  '+ cart[w].name +' <br> <br>';
	}
	$('#cart').html(out);
};

$(document).ready(function () {
	init();
	checkCart();
	showCart();
});

Вывод товаров осуществлен, теперь делаем функцию для передачи с серверной бд на клиент самих товаров.

Это core.php

<?php 
	$action = $_POST['action'];

	require '../templates/functions.php';

	switch ($action) {
		case 'init':
			init();
			break;
	}
 ?>

Это functions.php

<?php 
	connect();

	function connect () { //Подключение к БД
		$connection = new mysqli("localhost", "root","", "goods");

		if (!$connection) {
			die("Connection failed: " . mysqli_connect_error());
		}
		return $connection;
	}

	function init() { //Вывод товаров
		$conn = connect();
		$sql = "SELECT * FROM padlocks";
		$result = mysqli_query($conn, $sql);

		if (mysqli_num_rows($result) > 0) {
			$out = array();

			while ($row = mysqli_fetch_assoc($result)) {
				$out[$row["id"]] = $row;
			}
			echo json_encode($out);
		} else {
			echo "0";
		}
		mysqli_close($conn);
	}
 ?>

Сама корзина:

var cart = {};

function checkCart () {
	if (localStorage.getItem('cart') != null) {
		cart = JSON.parse(localStorage.getItem('cart'));
		showCart();
	}
};

function showCart () {
	var out = '';
	for (var w in cart) {
		out += '<span> ID товара: '+ w +'</span> <br>'+'<span> Кол-во товара: '+ cart[w] +'</span> <br> <span> Название:  '+ cart[w].name +' <br> <br>';
	}
	$('#my-cart').html(out);
};


$(document).ready(function () {
	checkCart();
});

Вопрос: почему имя undefined? Подправьте где надо, пожалуйста!