Question

当我单击添加按钮时，我想返回该消息。是的，确实显示了消息。但是，在我的情况下，同一页面上显示了3张图片，因此问题是当我单击按钮时，显示3张图片的“成功添加到购物车”。

下面是控制器文件，但我认为已完成。

public function addItem($id){
  $pro = products::find($id);
  Cart::add(['id' => $pro->id, 'name' => $pro->pro_name,
  'qty' => 1, 'price' => $pro->pro_price,
'options' =>[
  'img' => $pro->pro_img
  ]]);
    return back()->with('status', 'add to cart successfully');
}

需要在视图文件上进行更改，以下是视图文件：

@foreach($data as $p)

              <article class="product-grid-item product-block">
                  <figure class="product-item-thumbnail">
                      <a href="{{url('/productsDetails')}}/{{$p->pro_name}}">
                          <img
                                  src="{{asset('/img/')}}/{{$p->pro_img}}" alt=""
                                  width="400px" height="360px" />
                          <div class="product-item-mask">
                              <div class="product-item-actions">
                                  <button class="button button-secondary button-short">
                                      Quick View
                                  </button>

                                  <a href="{{url('/cart/add')}}/{{$p->id}}" class="button add-cart-cat button--small card-figcaption-button">Add to Cart</a>
                              </div>
                          </div>
                      </a>
                  </figure>


                  <div class="product-item-details">
                      {{--Add Cart Message--}}
                      @if (session('status'))
                          <div class="alert alert-success">
                              {{ session('status') }}
                          </div>
                      @endif
                      {{--End of Add Cart Message--}}
                      <div class="product-item-brand"><label><a href="#" alt="">{{$p->pro_name}}</a></label></div>

                      <h5 class="product-item-title">
                           {{$p->pro_code}}
                      </h5>

                      <!-- snippet location product_rating -->
                      <div class="product-item-price" data-product-price="JPY1,650">
                          <div>

                              <div class="product-price-line" data-product-price-wrapper="without-tax">
                                  {{--<span class="price-rrp highlight">RM-</span>--}}
                                  <meta itemprop="price" content="1650">
                                  <meta itemprop="priceCurrency" content="">
                                  <meta itemprop="availability" content="">
                                  <meta itemprop="itemCondition" itemtype="http://schema.org/OfferItemCondition" content="http://schema.org/Condition">
                                  <span class="price-value"> RM{{$p->pro_price}}</span>
                              </div>

                          </div>
                      </div>
                  </div>
              </article>
          @endforeach

结果显示如下：每次单击显示1条消息，而不是全部显示。

Image of the result

Answer 1

从您在$ data中的$ p中，我们可以获取该项目是否在购物车中。如果不是，请先在$ p中获取该数据，然后在此代码之前检查，

windows

Answer 2

您可以执行以下操作：

当您单击按钮时，获取id值并将其附加到您的网址

$(document).ready(function() {
    $(document).on('click', ".add-cart-cat", function() {

    var id = $(this).val(); //you can grab the value by any logic 

        $.ajax({
          url: '{{url("/cart/add")}}'+'/'+id,,
          method: 'GET',
          dataType: "json",
           context: this,
          success: function(data) {
            var successHtml = 'your success message div which will append to your desired div';
            // grab the id where you will append the div
            var target = $(this).attr('rel');
            $('#'+target).html(successHtml);

          }
        });

    }

});

在控制器的addItem方法中

返回一个成功消息字符串，并将其附加到想要显示它的所需div中。但请记住，您应该为该div提供唯一的ID，如下所示：

 <div id='{{$p->id}}'>
 //you success message will append it through ajax
</div>

要获取此唯一ID，您应该在<a> anchor tag上执行以下操作，在其上放置rel属性，并为其提供一个动态值，如下所示：

<a href="#" rel='{{$p->id}}' class="button add-cart-cat button--small card-figcaption-button">Add to Cart</a>

注意：不用介意我的代码的结构，但是如果您从这种逻辑中得到灵感，那么您肯定会轻松地做到这一点。

laravel问题：单击按钮时显示重复消息

2 个答案: