how to make add to cart button work correctly

Question

i have add-to-cart button and when it is clicked i want to update my cart and add new product (also update counter++) but with this code it inserts only last clicked product and deletes other product. and if its possible to delete products from cart

<script>
    $(document).ready(function () {
        $('.add_to_cart').click(function () {
            var product_id = $(this).data('id');
            var product_name = $(this).data('name');
            var product_price = $(this).data('price');
            $.ajax({
                url: "/uketesi/index",
                method: "POST",
                datatype: "json",
                data: {
                    'product_id':product_id,
                    'product_name':product_name,
                    'product_price':product_price,
                },
                success:(function (data) {
                    alert("produqti warmatebit daemata")
                    $("#cart").html("<table id=\"example2\">" +
                        "<thead>" +
                        "<tr>" +
                        "</tr>"+
                        "<tr>" +
                        "<td>" + product_name + "</td>" +
                        "<td>" + product_price + "</td>" +
                        "<td>" + product_id + "</td>" +
                        "</tr>" +
                        "</thead>" +
                        "</table>");
                })
            });
        });
    });
</script>

Answer 1

use this :

$(document).ready(function () {
        $('.add_to_cart').click(function () {
            var product_id = $(this).data('id');
            var product_name = $(this).data('name');
            var product_price = $(this).data('price');
            $.ajax({
                url: "/uketesi/index",
                method: "POST",
                datatype: "json",
                data: {
                    'product_id':product_id,
                    'product_name':product_name,
                    'product_price':product_price,
                },
                success:(function (data) {
                    alert("produqti warmatebit daemata")
                    $("#cart table tbody").append(
                        "<tr>" +
                        "<td>" + product_name + "</td>" +
                        "<td>" + product_price + "</td>" +
                        "<td>" + product_id + "</td>" +
                        "</tr>");
                    int counter = $("#cart table tbody tr").length;
                })
            });
        });
    });