Упрощенно (на более полное нет времени). Сохранить под любым именем и запустить.
<?php
session_start();
//типа имитации БД
$base = [
11 => ['name' => 'Товар №1', 'price' => 100],
21 => ['name' => 'Товар №2', 'price' => 200],
31 => ['name' => 'Товар №3', 'price' => 300]
];
//корзина
$cart = &$_SESSION['basket'];
//это очень упрощенно, а в реальности должо быть серьезнее
if($_POST['add']) {
//есть ли товар в корзине?
if(!array_key_exists($_POST['add'], $cart)) {
//типа запроса к БД
//в реальности же сложнее
//1) использовать нужно либо mysqli, либо PDO, оригинальное расширение MySQL лучше забыть сразу
//2) выше указанные расширения могут фильтровать данные извне, в случае оригинального расширения этому нужно уделять особенное внимание
$cart[$_POST['add']] = ['count' => 1, 'price' => $base[$_POST['add']]['price' ], 'prop' => ['name' => $base[$_POST['add']]['name' ]]];
} else $cart[$_POST['add']]['count']++; //товар есть в корзине, добавляем еще один
//ответ в формате JSON
header('Content-Type: application/json');
exit(json_encode([
'cart' => //состояние корзины
[
'count' => array_sum(array_map('current', $cart)), //товаров в корзине
'total' => array_sum(array_map('array_product', $cart))], //на сумму
'current' => $cart[$_POST['add']]['count'] //количество добавляемого товара в корзине
])
);
}
?>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Корзина</title>
<style>
li {
list-style: none;
}
</style>
</head>
<body>
<ul>
<li>Корзина</li>
<li>Товаров: <span id="count">0</span> шт.</li>
<li>На сумму: <span id="total">0</span> руб.</li>
</ul>
<div class="goods">
<a href="?view=product&goods_id=11"><img src="baseimg/11.jpg" alt="Картинка товара" width="200" height="200"></a>
<a class="good_name" href="?view=product&goods_id=11">Товар №1</a>
<p class="price">Цена: <span>1000 р.</span></p>
<button data-add="11">Добавить в корзину</button> <span></span>
</div>
<div class="goods">
<a href="?view=product&goods_id=21"><img src="baseimg/21.jpg" alt="Картинка товара" width="200" height="200"></a>
<a class="good_name" href="?view=product&goods_id=21">Товар №2</a>
<p class="price">Цена: <span>200 р.</span></p>
<button data-add="21">Добавить в корзину</button> <span></span>
</div>
<div class="goods">
<a href="?view=product&goods_id=31"><img src="baseimg/31.jpg" alt="Картинка товара" width="200" height="200"></a>
<a class="good_name" href="?view=product&goods_id=31">Товар №3</a>
<p class="price">Цена: <span>300 р.</span></p>
<button data-add="31">Добавить в корзину</button> <span></span>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$('button').click(function() {
var btn = $('button').prop('disabled', true), //сделать кнопки добавления товара на время запроса недоступными
bt = $(this); //текущая кнопка
$.post(location, {add: bt.data('add')}, function(data) {
btn.prop('disabled', false); //разрешить добавление товаров
//получен ответ
if(data.cart) {
$.each(data.cart, function(k, v) {
$('#'+k).text(v) //вывести информацию о корзине
});
bt.next().text('В корзине: ' + data.current) //количество текущего товара в корзине
}
})
});
</script>
</body>
</html>