Обновление изменённой с помощью ajax сессии
Столкнулся с такой проблемой: в index.php передаю через ajax запрос данные в CreatingShoppingCart.php, где они записываются в сессию. Но на index.php эта сессия как была пустой, так и остаётся и чтобы она обновилась нужно перезапустить страницу, чего я хочу избежать.
index.php
<?php
session_start();
?>
<div class="box-container">
<?php
$sql1 = "SELECT * FROM coffee ORDER BY id ASC";
if($result = $conn->query($sql1))
{
foreach($result as $row)
{
?>
<div class="box" >
<img src="<?php echo $row["LinkToThePicture"]; ?>" alt="">
<h3><?php echo $row["Name"]; ?></h3>
<div class="price"><?php echo $row["Price"];?>₽</div>
<input type="submit" id="add-btn" name="add_to_cart" class="btn qwe" value="Добавить в карзину"/>
<input type="hidden" class="id" name="id" value="<?php echo $row["id"];?>"/>
<input type="hidden" class="linkToThePicture" name="linkToThePicture" value="<?php echo $row["LinkToThePicture"];?>"/>
<input type="hidden" class="name" name="name" value="<?php echo $row["Name"];?>"/>
<input type="hidden" class="price" name="price" value="<?php echo $row["Price"];?>"/>
<input type="hidden" class="quantity" name="quantity" value="1"/>
</div>
<?php
}
}
?>
</div>
<script>
$(document).ready(function(){
$('.qwe').on('click', function(){
var id = $(this).closest('.box').find('input.id').val();
var linkToThePicture = $(this).closest('.box').find('input.linkToThePicture').val();
var name = $(this).closest('.box').find('input.name').val();
var price = $(this).closest('.box').find('input.price').val();
var quantity = $(this).closest('.box').find('input.quantity').val();
console.log(id, linkToThePicture, name, price, quantity)
$.ajax({
method: "POST",
url: "CreatingShoppingCart.php",
data: { id: id, linkToThePicture: linkToThePicture, name: name, price: price, quantity: quantity }
})
.done(function(msg) {
alert( "Data Saved: " + msg );
});
})
});
</script>
'тут просто вывод масива этой сессии приложил для наглядности'
<div class="cart-items-container">
<?php
if(count($_SESSION["shopping_cart"]) > 0)
{
$total = 0;
foreach($_SESSION["shopping_cart"] as $key => $product)
{
?>
<div class="cart-item">
<a class="fas fa-times" href="index.php?action=delete&id=<?php echo $product["id"]; ?>">
</a>
<a class="fas fa-plus" href="index.php?action=plus&id=<?php echo $product["id"]; ?>">
</a>
<a class="fas fa-minus" href="index.php?action=minus&id=<?php echo $product["id"]; ?>">
</a>
<img src="<?php echo $product["linkToThePicture"];?>" alt="">
<div class="content">
<h3><?php echo $product["name"];?></h3>
<div class="price"><?php echo $product["price"];?>₽</div>
<h3><?php echo $product["quantity"];?></h3>
</div>
</div>
<hr>
<?php
$total = $total + ($product["quantity"]*$product["price"]);
}
?><div class="price"><?php echo number_format($total, 2); ?>₽</div>
<a href="#popup" class="btn">Оформить заказ</a><?php
show();
}
else
{
?><h3>Карзина пуста</h3><?php
show();
}
?>
</div>
CreatingShoppingCart.php
<?php
$id = $_POST["id"];
$name = $_POST["name"];
$price = $_POST["price"];
$quantity = $_POST["quantity"];
$linkToThePicture = $_POST["linkToThePicture"];
echo "$id $linkToThePicture $name $price $quantity<br>";
session_start();
$product_ids = array();
if(isset($_SESSION['shopping_cart']))
{
$count = count($_SESSION['shopping_cart']);
$product_ids = array_column($_SESSION['shopping_cart'], 'id');
if (!in_array($_POST["id"],$product_ids))
{
$_SESSION['shopping_cart'][$count] = array
(
'id' => $_POST["id"],
'name' => $_POST["name"],
'price' => $_POST["price"],
'quantity' => $_POST["quantity"],
'linkToThePicture' => $_POST["linkToThePicture"]
);
}
else
{
for($i = 0; $i < count($product_ids); $i++)
{
if ($product_ids[$i] == $id)
{
$_SESSION['shopping_cart'][$i]['quantity'] += $quantity;
}
}
}
}
else
{
$_SESSION['shopping_cart'][0] = array
(
'id' => $id,
'name' => $name,
'price' => $price,
'quantity' => $quantity,
'linkToThePicture' => $linkToThePicture
);
}
?>
Ответы (1 шт):
В качестве быстрого решения предлагаю следующее: перенесите код, который формирует корзину из index.php в файл CreatingShoppingCart.php. При загрузке страницы и при каждом изменении корзины обращайтесь к нему по аякс и полученный HTML вставляйте на страницу. Хотя я бы сделал API, которое возвращает корзину в виде JSON, а для фронта задействовал фреймворк вроде VueJs.