Добавление в корзину без перезагрузки страницы в интернет-магазине

Рейтинг: 1Ответов: 1Опубликовано: 03.03.2015

Делаю интернет-магазин на самописном движке, и хотел бы сделать добавление в корзину без перезагрузки страницы, в я javascript еще новичок. Где-то здесь был вопрос похожий, что-то взял оттуда.

Проблема в том, что при клике на кнопку "Добавить в корзину", добавление не отображается (хотя в сессию добавляется), пока не перезагрузить страницу, после перезагрузки страницы и кол-во товара, и цена нормально прибавляется.

Подскажите плиз, как нужно исправить, чтобы добавлялся товар при первом клике.

Вот код из js:

$('.buyitem').click(function(e) {
    e.preventDefault();
    var url = $(this).attr('href');
    var price = $(this).closest('.product-table').find('span').text();
    price = parseInt(price, 10);
    total_items = parseInt($("#bought").text(), 10) + 1;
    total_price = parseInt($("#sum").text(), 10) + price;
    $.get(url, {total_price: total_price, total_items: total_items}, function() {
        $('#bought').text(total_items); // Запись в нужные места на странице
        $('#sum').text(total_price);
    });
    return false;
});

Код из php:

<div class="product-table">
    <h2><a href="?view=product&amp;goods_id=<?=$product['goods_id']?>"><?=$product['name']?></a></h2>
    <div class="product-table-img-main">
        <div class="product-table-img">
            <a href="?view=product&amp;goods_id=<?=$product['goods_id']?>"><img src="<?=PRODUCT?><?=$product['img']?>" alt="" /></a>
        </div>
    </div>
    <p>Цена : <span id="price"><?=$product['price']?></span></p>
    <a class="buyitem" href="?view=addtocart&amp;goods_id=<?=$product['goods_id']?>"><img class="addtocard-index" src="img/addcard.jpg" alt="Добавить в корзину" /></a>
</div>

Код корзины в сайдбаре:

<div class="basket">
    <h2><span>Корзина</span></h2>
    <div>
        <p>
        <?php if(isset($_SESSION['total_quantity'])): ?>
    Товаров в корзине:<br />
    <span id="bought"><?=$_SESSION['total_quantity']?></span> на сумму <span id="sum"><?=$_SESSION['total_sum']?></span> руб.
    <a href="?view=cart"><img src="img/oformit.jpg" alt="" /></a>
    <?php else: ?>
        Корзина пуста
    <?php endif; ?>
    </p>
    </div>
</div>

Метод добавления в корзину:

public function addtocart($goods_id, $qty = 1) {
    if(isset($_SESSION['cart'][$goods_id])) {
        // Если в массиве cart уже есть добавляемый товар
        $_SESSION['cart'][$goods_id]['qty'] += $qty;
        return $_SESSION['cart'];
    } else {
        // Если товар кладется в корзину впервые
        $_SESSION['cart'][$goods_id]['qty'] = $qty;
        return $_SESSION['cart'];
    }
}

Метод подсчета кол-ва товаров:

public function total_quantity() {
    $_SESSION['total_quantity'] = 0;
    foreach($_SESSION['cart'] as $key => $value) {
        if(isset($value['price'])) {
            // Если получена цена товара из БД - суммируем кол-во
            $_SESSION['total_quantity'] += $value['qty'];
        } else {
            // Удаляем такой id из сессии
            unset($_SESSION['cart'][$key]);
        }
    }
}



Переписал код немного, заработало:

в Javascript файле:

var summ = $("#sum").text();
var col = $("#bought").text();
if(summ < 1 || col < 1) {
    $('.col').fadeOut();
    $('.sum').fadeOut();
    $('.oformit').fadeOut();
}
$(".buyitem").click(function() {
    var url = $(this).attr('href');
    var goods_id = $(this).attr('id');
    var price = $(".product-table .id_" + goods_id).text();
    summ = Number(summ) + Number(price);
    col++;
    $.ajax({
        url: url,
        type: 'POST',
        data: {col: col, summ: summ, goods_id: goods_id},
        success: function(res) {
            if(res){
                // Запись в нужные места на странице
                $('.empty_cart').fadeOut();
                $('.col').fadeIn();
                $('.sum').fadeIn();
                $('#bought').text(col);
                $('#sum').text(summ);
                $('.oformit').fadeIn();
            }
        },
        error: function() {
            alert('Ошибка добавления в корзину!');
        }
    });
    return false;
});

Код в сайдбаре:

<?php if(isset($_SESSION['total_quantity'])): ?>
<p class="col">Товаров: <span id="bought"><?=$_SESSION['total_quantity']?></span></p>
<p class="sum">На сумму: <span id="sum"><?=$_SESSION['total_sum']?></span> руб.</p>
<a href="?view=cart" class="oformit"><img src="<?=TEMPLATE?>img/oformit.jpg" alt="" /></a>
<?php else: ?>
<p class="empty_cart">Корзина пуста</p>
<p class="col">Товаров: <span id="bought"></span></p>
<p class="sum">На сумму: <span id="sum"></span> руб.</p>
<a href="?view=cart" class="oformit"><img src="<?=TEMPLATE?>img/oformit.jpg" alt="" /></a>
<?php endif; ?>

Ответы

Ответов пока нет.