0

$(document).ready(function(){
    $(document).on("click","#btn_delete",function () {
        console.log('working');
            });
});
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HomeShopping</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" >
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div class="container-fluid">
    <div class="row px-5">
        <div class="col-md-7">
            <div class="shopping-cart">
                <h6>My Cart</h6>
                <hr>
             <?php
                include("functions/functions.php");

                $total = 0;

                $ip_add = getRealIpUser();

                $select_cart = "select * from cart where ip_add='$ip_add'";

                $run_cart = mysqli_query($conn,$select_cart);

                while($row_cart = mysqli_fetch_array($run_cart)){

                    $pro_id = $row_cart['p_id'];

                    $pro_size = $row_cart['size'];

                    $pro_quantity = $row_cart['quantity'];

                    $get_products = "select * from products where no='$pro_id'";

                    $run_products = mysqli_query($conn,$get_products);

                    while($row_products = mysqli_fetch_array($run_products)){

                        $product_title = $row_products['product_title'];

                        $product_img1 = $row_products['product_img1'];

                        $only_price = $row_products['product_price'];


                        ?>
                        <form  method="post" class="cart-items">
                            <div class="border rounded">
                                <div class="row bg-white">
                                    <div class="col-md-3 pl-0">
                                        <img src="product_images/<?php echo $product_img1; ?>" alt="Image1" class="img-fluid">
                                    </div>

                                    <div class="col-md-6">
                                        <h5 class="pt-2"><?php echo $product_title; ?></h5>
                                        <small class="text-secondary">Seller: dailytuition</small>
                                        <h5 class="pt-2"><?php echo $only_price; ?></h5>
                                        <button type="submit" class="btn btn-warning">Save for Later</button>
                                        <button id="btn_delete" class="btn btn-danger mx-2"  value="<?php echo $pro_id;?>">Remove</button>
                                    </div>

                                    <div class="col-md-3 py-5">
                                        <button type="button" class="btn bg-light border rounded-circle" ><i class="fas fa fa-minus" ></i></button>
                                        <input type="text" id="<?php echo $pro_id?>" value="<?php echo $pro_quantity?>" class="form-controls w-25 d-inline">
                                        <button type="button" class="btn bg-light border rounded-circle" > <i class="fas fa fa-plus" ></i></button>
                                    </div>
                                </div>
                            </div>
                        </form>


                    <?php }}?>
            </div>
        </div>
    </div>
</div>

1. connect database, there is no problem in my code

My problem is when I check my jquery code, console.log('working') it doesn't show in my F12

console.photo

2. Also, I add other jquery codes to check my problem

$(document).ready(function(){
    $(document).on("click","#remove",function () {

        let id = $(this).attr("value");
        console.log(id);
 }
}

Execute the above code，and click remove button it causes to refresh page. What's the problem?

Ivar
  • 6,138
  • 12
  • 49
  • 61
donghero
  • 37
  • 5
  • Your remove button is a `type="submit"` button, so when you click it, it submits the page. Also, that button only has a `name` called "remove`. In order for the click event to work, it will need an `id` with that value. – Ivar Mar 05 '20 at 22:35
  • I tried to that , but it still doesn't work.@Ivar – donghero Mar 05 '20 at 22:50
  • 1
    Yeah, I find the problem, it needs to add type="button", OMG. Thanks your suggestion – donghero Mar 05 '20 at 22:53

0 Answers0