Блог

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

                 <div class="row">
                    <div class="col-md-6">

                        <div class="card">
                            <div class="card-header">
                                <h4 class="text-center">Orders</h4>
                            </div>
                            <div class="card-body">
                                <form action="" method="POST">
                                    @csrf
                                    <div class="ordered-products">
                                        <table class="table table-bordered table-primary" id="tblEntAttributes">
                                            <thead>
                                                <tr>
                                                    <td>Name</td>
                                                    <td>Quantity</td>
                                                    <td>Price</td>
                                                </tr>
                                            </thead>
                                            <tbody>

                                            </tbody>
                                        </table>
                                    </div>
                                    <div class="calc">
                                        <hr>
                                        Total: NRs. <span class="total-amt">0</span>

                                        <input type="submit" value="Pay" class="float-right btn btn-sm btn-success">
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>


                    <div class="col-md-6">
                        <input type='text' placeholder="Search Here.." id='searchp' class="form-control"/>
                        <div class="row">
                            <div class="col-md-12">



                                <div class="products-card">
                                    @foreach ($products as $product)
                                        <div class='product product-{!! $product->id !!}'>
                                            <a class="cart-add" data-id="{!! $product->id !!}">
                                                <div class="product-card">
                                                    <div class="card-image-holder">
                                                        <?php
                                                            if($product->image){
                                                        ?>
                                                            <img class="card-img-top" src="{{ asset('storage/productImages/'.$product->image) }}" alt="Card image cap" >

                                                        <?php
                                                            }
                                                            else{
                                                        ?>
                                                                <img class="card-img-top" src="{{ asset('/dist/img/boxed-bg.png') }}" alt="Card image cap" >
                                                        <?php
                                                            }
                                                        ?>
                                                    </div>
                                                    <h5 class="card-title">{{ $product->name }}</h5>
                                                </div>
                                            </a>

                                        </div>
                                    @endforeach

                                </div>


                            </div>
                        </div>

                    </div>
                </div>
 

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

 <script>
    /*runs each time a new character is entered*/
    $('#searchp').keyup(function() {
    /*takes inpt from input box*/
        var seterm = $('#searchp').val();
        /*scans through each element*/
        for (var i = 0; i < $('.product').length; i  ) {
            /*Makes all elements visible*/
            $('.product:eq('   i   ')').css('display', 'inline-block');
            /*If it doesn't match the input it is hidden*/
            if ($('.product:eq('   i   ')').text().toLowerCase().indexOf(seterm) < 0) {
                $('.product:eq('   i   ')').css('display', 'none');
            }
        }
    });

    $(document).ready(function() {
        $('.cart-add').click(function() {
            var id = $(this).data('id');
            var url = 'pos/'   id   '/data';
            $.get(url, function (data) {
                var i = i  ;
                var newRowContent = "<tr id="  data.id  "><td>"  data.name  "</td><td id=qty-"  data.id  ">"  data.quantity  "</td><td id=price-"  data.id  ">"  data.price  "</td></tr>";
                $(newRowContent).appendTo($("#tblEntAttributes"));
            });
        });


    });
</script>
 

Главное, что теперь я перенес выбранный товар в раздел корзины через js, и теперь, если количество отдельного товара изменится, общая сумма продукта и общая сумма также должны быть изменены. Я понятия не имею, как это сделать. Любая ссылка также может быть полезной. I am using laravel as backend