删除项目后的JavaScript总费用

时间:2017-01-03 15:51:31

标签: javascript jquery

我已经预售了一些我卖的东西:

<?php foreach ($selectedItems as $item): ?>
                <tr  class="product" data-price="<?= $item->price ?>">
                    <th class="items"><?= $item->name ?></th>
                    <th id="price" class="items middle-th "> <!-- the 3rd column -->
                        <div >
                            <button type="button" class="sub" title="If u want less quantity">-</button>
                            <input class="quantityTxt quantity " id="quantity" name="quantity[]" type="text" value="1" onchange="quantityChange(this)" > 
                            <button type="button" class="add" title="If u want more quantity" >+</button>
                        </div>
                    </th>
                    <th>       
                        <span class="productTotal"></span>       
                    </th>
                    <th id="price" class="items">
                        <button class="remove_field" data-value="<?= $item->price ?>" title="Click to delete product" >
                            <div class="glyphicon glyphicon-trash" ></div>
                        </button>
                    </th>
                </tr>
            <?php endforeach; ?>
        </table>
        <div class="row-fluid well">
            <strong id="total"> Total: &euro; <span id="sum"> </span> </strong></div>
        <div class="payment">

我设置onClick以在按下按钮后删除行,以便在删除行时删除行,以减去产品的总成本总和。后来是我的脚本代码,我有所有的东西,但我只留下了已删除行的总成本减去。

$('table').on('click', 'button.remove_field', function () {
    $(this).closest('tr').remove();
    var id = $(this).attr('data-value');

    console.log(id);
});

$('.add').click(function () {
    var target = $('.quantity', this.parentNode)[0];
    target.value = +target.value + 1;
    updateTotal();
});

$('.sub').click(function () {
    var target = $('.quantity', this.parentNode)[0];
    if (target.value > 1) {
        target.value = +target.value - 1;
    }
    updateTotal();
});

var updateTotal = function () {

    var sum = 0;
    //Add each product price to total
    $(".product").each(function () {
        var price = $(this).data('price');
        var quantity = $('.quantityTxt', this).val();
        //Total for one product
        var subtotal = price * quantity;
        //Round to 2 decimal places.
        subtotal = subtotal.toFixed(2);
        //Display subtotal in HTML element
        $('.productTotal', this).html(subtotal);
    });

    // total
    $('.productTotal').each(function () {
        sum += Number($(this).html());
    });
    $('#sum').html(sum.toFixed(2));
};

//Update total when quantity changes
$(".product").keyup(function () {
    updateTotal();
});

//Update totals when page first loads
updateTotal();

// set this from local
$('span.productTotal').each(function () {
    $(this).before("&euro;");
});

// unit price
$('.product').each(function () {
    var $price = $(this).parents("div").data('price');
    $(this).before($price);
});

0 个答案:

没有答案