使用jquery在php/laravel循环中动态地乘数据

0g0grzrc  于 2022-11-29  发布在  jQuery
关注(0)|答案(1)|浏览(143)

所以我在一个crud系统中使用jQuery,其中有一个数量的输入,它乘以存储在数据库中的价格,然后在旁边的字段中输出它,但它在输入旁边的所有字段中输出它。我尝试了所有方法,但我无法做到这一点,任何人都可以告诉我我的代码有什么问题,
heres the real output
and this is the result i want
这是我视图文件

<?php 
                $i=1;
            ?>
    @foreach ($productData as $rsproductData)
        <tr>
            <td><?php echo $i ?></td>
            <?php
                $i++;
            ?>
            <td class="d-none">{{$rsproductData->id}}</td>
            <td>{{$rsproductData->products}}</td>
            <td>{{$rsproductData->wholesale}}</td>
            <td>{{$rsproductData->price}}</td>
            <td><input type="number" class="form-control qtyChckInput mb-2" name="qty"></td>
            <td class="totalPrice" name="totalPrice">0</td>
            <td><button class="btn btn-success editModalBtn">Edit</button></td>
            <td><button class="btn btn-danger deleteModalBtn">Delete</button></td>
        </tr>
    @endforeach
        <tfoot>
            <tr>
                <td></td><td></td><td></td><td></td>
                <th>Item Total</th>
                <td id="itemTotal">0</td>
                <td></td><td></td>
            </tr>
            <tr>
                <td></td><td></td><td></td><td></td>
                <th>10% discount on Item Total</th>
                <td id="itemDiscount">0</td>
                <td></td><td></td>
            </tr>
            <tr>
                <td></td><td></td><td></td><td></td>
                <th>5% Tax on Item Total</th>
                <td id="itemTax">0</td>
                <td></td><td></td>
            </tr>
            <tr>
                <td></td><td></td><td></td><td></td>
                <th>Grand Total</th>
                <td id="itemGrand">0</td>
                <td></td><td></td>
            </tr>
        </tfoot>
</tbody>

这是我的js文件

$('input[name*="qty"]').keyup(function()
    {
        $tr = $(this).closest('tr');

        var data = $tr.children("td").map(function () {
            return $(this).text();
        }).get();

        text = $(this).val();
        
        $(".totalPrice").html(data[4] * text)
        
        var itemTotal = $('.totalPrice').html();
        
        $('#itemTotal').html(itemTotal);

        var itemDiscount = itemTotal * (1 - 10 / 100);

        $('#itemDiscount').html(itemTotal - itemDiscount);

        var itemTax = itemTotal * (1 - 5 / 100);

        $('#itemTax').html(itemTotal - itemTax);

        var itemGrand = itemTax + itemDiscount - itemTotal;

        console.log(itemGrand);

        $('#itemGrand').html(itemGrand);
    });
qnzebej0

qnzebej01#

尝试为HTML实体使用动态id/class,下面是一个简短的计算,供您参考。

<tr>
    <td id="products_{{ $rsproductData->id }}">{{$rsproductData->products}}</td>
    <td id="wholesale_{{ $rsproductData->id }}">{{$rsproductData->wholesale}}</td>
    <td id="price_{{ $rsproductData->id }}" value="{{$rsproductData->price}}">{{$rsproductData->price}}</td>
    <td><input type="number" class="form-control qtyChckInput mb-2" data-product="{{ $rsproductData->product }}" name="qty"></td>
</tr>

<script>
    $('input[name*="qty"]').keyup(function()
    {
        var id = $(this).data('product');
        var price = $("#price_"+id).val();
        var quantity = $(this).val();
        // Short calucalation for example
        $('#itemGrand').html(price*quantity);
    });
</script>

相关问题