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

< Сильный > Таблица

<div class="container">
                <table class="table table-striped" id="mytable">
                    <thead>
                    <tr>
                        <th>ProductID</th>
                        <th>Productname</th>
                        <th>Price</th>
                        <th>Qty</th>
                        <th>Amount</th>
                        <th>Delete</th>
                    </tr>
                    </thead>
                    <tbody>

                    </tbody>
                </table>
            </div>

        </div>

        <div style='text-align: right; margin:10px'>
            <label><h3>Total amount: </h3></label>
            <span style="font-size: 40px; color: #ff0911" id='total-amount'></span>
        </div>

Показать продукты

<script> 
getProducts();
function getProducts() {
    $.ajax({
        type: 'GET',
        url: 'all_cart.php',
        dataType: 'JSON',
        success: function(data) {
            data.forEach(function(element) {
                var id = element.id;
                var product_name = element.product_name;
                var price = element.price;
                $('#mytable tbody').after
                (
                    '<tr> ' +
                    '<td>' + id + '</td>' +
                    '<td>' + product_name + '</td>' +
                    '<td>' + price + '</td>' +
                    "<input type='hidden' class='price' name='price' value='" + price + "'>" +
                    '<td>' + "<input type = 'text' class='qty' name='qty' value='1'/>" + '</td>' +
                    '<td>' + "<input type = 'text' class='amount' id='amount' disabled/>" + '</td>' +

                    '<td>' +  " <Button type='button' class='btn btn-primary' onclick='deleteProduct(this," + id + ")' >Delete</Button> " + '</td>' +
                    '</tr>');
            });
        },
        error: function(xhr, status, error) {
            alert(xhr.responseText);
        }
    });
}

Расчет итогов

$(function() {
    $(".price, .qty").on("keydown keyup click", function () {
        var price = $(this).parents('tr').find('.price');
        var qty= $(this).parents('tr').find('.qty');
        var sum = (
        Number($(price).val()) * Number($(qty).val())
        );
        $(this).parents('tr').find('.amount').val(sum);
        calculateAmount();
    });
});

function calculateAmount() {
    var total = 0;
    $('.amount').each(function(e){
        total += Number($(this).val());
    });
    $('#total-amount').text(total);
}

удалить функцию продукта

function deleteProduct(event, id) {
                $.ajax({
                    type: 'POST',
                    url: 'remove.php',
                    dataType: 'JSON',
                    data: {id: id},
                    success: function (data) {
                        $(event).parent('tr').remove();
                        calculateAmount();
                    },
                    error: function (xhr, status, error) {
                        alert(xhr.responseText);

                    }
                });
}

< Сильный > remove.php

<?php
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    include "db.php";
    $conn = new mysqli($servername, $username, $password, $dbname);
    $stmt = $conn->prepare("delete from cart where id=?");
    $stmt->bind_param("s", $id);
    $id = $_POST["id"];
    if ($stmt->execute())
        {
            echo 1;
        }
    else 
        {
                echo 0;
        }
        $stmt->close();
        }
?>

enter image description here

0
creative one2018 31 Май 2019 в 08:22

2 ответа

Лучший ответ

Вы можете использовать логику как:

При отображении товаров (отредактируйте строку, просто назначьте динамический идентификатор тегу tr ) -

....
'<tr id=tr_'+id+'> ' +
....

& в функции удаления продукта (удалите соответствующий текст, используя идентификатор) -

....
$('#tr_'+id).remove();
....

В вашем коде ...

Показать продукты функции-

<script> 
getProducts();
function getProducts() {
    $.ajax({
        type: 'GET',
        url: 'all_cart.php',
        dataType: 'JSON',
        success: function(data) {
            data.forEach(function(element) {
                var id = element.id;
                var product_name = element.product_name;
                var price = element.price;
                $('#mytable tbody').after
                (
                    '<tr id=tr_'+id+'> ' +
                    '<td>' + id + '</td>' +
                    '<td>' + product_name + '</td>' +
                    '<td>' + price + '</td>' +
                    "<input type='hidden' class='price' name='price' value='" + price + "'>" +
                    '<td>' + "<input type = 'text' class='qty' name='qty' value='1'/>" + '</td>' +
                    '<td>' + "<input type = 'text' class='amount' id='amount' disabled/>" + '</td>' +

                    '<td>' +  " <Button type='button' class='btn btn-primary' onclick='deleteProduct(this," + id + ")' >Delete</Button> " + '</td>' +
                    '</tr>');
            });
        },
        error: function(xhr, status, error) {
            alert(xhr.responseText);
        }
    });

& в функции удаления

function deleteProduct(event, id) {
                $.ajax({
                    type: 'POST',
                    url: 'remove.php',
                    dataType: 'JSON',
                    data: {id: id},
                    success: function (data) {
                        //$(event).parent('tr').remove();
                        $('#tr_'+id).remove();
                        calculateAmount();
                    },
                    error: function (xhr, status, error) {
                        alert(xhr.responseText);

                    }
                });
}

Я просто объясняю логику .. но вам нужно идти в деталях, чтобы настроить оставшиеся звонки .. :)

0
Rakesh P 31 Май 2019 в 05:45

Если вы удаляете данные из таблицы после удаления, попробуйте использовать этот код

1.a после успешного возврата удалить функцию запустить снова getProducts() данные функции снова получить и сбросить в таблице

2. Удалить функционал, вернуть все данные в функции успеха, используя php, перейти к remove.php, выбрать все данные запроса и вернуть все данные.

function deleteProduct(event, id) {
            $.ajax({
                type: 'POST',
                url: 'remove.php',
                dataType: 'JSON',
                data: {id: id},
                success: function (data) {
                     getProducts();
                    $(event).parent('tr').remove();
                    calculateAmount();
                },
                error: function (xhr, status, error) {
                    alert(xhr.responseText);

                }
            });
0
Developer 31 Май 2019 в 05:32