как добавить товар в корзину без обновления страницы

Question

когда я пытаюсь нажать на кнопку «Добавить в корзину», страница перезагружается, я использую php, ajax и javascript. Пожалуйста, помогите, чтобы добавить в корзину без обновления страницы Может кто-нибудь, пожалуйста, взгляните на мой ajax и addtocart.php

PHP, AJAX, MySQL, JavaScript

<?php 
if(!empty($cart_data)){

    foreach($cart_data as $row){
    ?>

    <div class="product-item">
        <div class="pi-pic">
            <img src="<?= $row->image ?>" alt="">

            <div class="pi-links">
                <a href="#" onclick="addtocart(<?= $row->id ?>)" class="add-card"><i class="flaticon-bag" ><span>ADD TO CART</span></i></a>

                <a href="#" class="wishlist-btn"><i class="flaticon-heart"></i></a>

            </div>
        </div>

        <div class="pi-text">

            <h6>Rs<?= $row->price ?></h6>
            <strike>Rs<?= $row->oldprice ?></strike> 
            <p><?= $row->name ?> </p>

        </div>
    </div>

    <?php
    }
}
?>

function addtocart(id){        
    if(id != ""){
        $.ajax({
            url:'<?php echo base_url(); ?>home/addtocart',
            type:'POST',
            dataType:'json',
            data:{ 
                'id' : id 
            },

            success: function(data) {
                $('.count').html(data.count);
                //location.reload();
            }
        });
    } else {
        return false;
    }

    return false;
}

Функция контроллера

    public function addtocart(){
    $id = $_POST['id'];
    $cart_data=$this->Cart->get_cart($id);
    $cart_data = json_decode( json_encode($cart_data), true);
     $data = array('id' => $id,'qty' => 1,'price' => $cart_data[0]["price"],'name' => $cart_data[0]["name"],'title' => $cart_data[0]["name"],'image'=> $cart_data[0]["image"],'code'    => $cart_data[0]["code"],'description'=> $cart_data[0]["description"],);$cart_row = $this->cart->insert($data);
        $cart = array_values($this->cart->contents($cart_row));
    $data = array('status' => 'Success','count'=>$this->cart->total_items(),);
    echo json_encode($data);
    }

Answer 1

Мы собираемся изменить поток вашего представления AJAX.

Замените ваш HTML тег привязки ниже. и добавьте код jquery в ваш файл.

<a href="javascript:" data-id="<?= $row->id ?>" class="add-card"><i class="flaticon-bag" ><span>ADD TO CART</span></i></a>


$(document).on('click','.add-card',function(e){
e.preventDefault();
var id=$(this).data('id');
addtocart(id);
});

Я установил id в data id вашего тега привязки. и удалите функцию onclick. и установите javascript: в вашем href.

затем добавьте блок jquery в ваш скрипт, который предотвращает активность тега привязки. и вызвать функцию addtocart () с идентификатором, который мы получаем из этого параметра.

Пожалуйста, попробуйте вышеуказанное решение, надеюсь, оно будет работать.