Laravel 闪光弹窗通知

Question

我在 jQuery + Bootstrap bootstrap-growl.

上找到了一个很棒的弹出通知库

我想专门用它来将产品添加到购物车。

我试图在按钮点击时放置一个处理程序，但通知如下所示：

Product <strong>{{ Session::get('add-product') }}</strong> added to cart

不处理大括号。

我尝试通过 session::flash 来做到这一点，将接收到的值转换为类型 =“隐藏”的输入，但闪光灯仅在重启后触发，这不是我需要的。如何首先在输入中使用 ajax 加载值，然后在通知中加载？谁能给个主意？

如何尽可能正确地实现这一点？或者有哪些库允许从 session::flash?

发出 toast 通知

具有添加到购物车功能的 CartController：

  public function addCart(Request $request, $id){
    $product = Product::find($id);
    $oldCart = Session::has('cart') ? Session::get('cart') : NULL;
    $cart = new Cart($oldCart);
    $cart->add($product, $product->id);

    $request = Session::put('cart', $cart);

    //Session::flash('add-product', $product->name);

    return response()->json([
         'total_quantity' => Session::has('cart') ? Session::get('cart')->totalQty : '0' 
     ]);
  }

使用闪光灯查看，如果可能的话，以某种方式通过它们：

    <div class="col-lg-12">
    @if(Session::has('add-product'))
        <p class="alert alert-success text-center mt-2  mb-1 addpopup">
           Product<strong>{{ Session::get('add-product') }}</strong> added to cart
        </p>
        <input type="hidden" class="addpopup">Product<strong>{{ Session::get('add-product') }}</strong> added to cart</input>
    @endif
    </div>

Ajax 用于将产品添加到购物车，以及该库中触发通知的函数：

$(document).ready(function() {
$('.product-icon-container').find('.ajaxcartadd').click(function (event){
event.preventDefault();
$.ajax({
url: $(this).attr('href'),
dataType: 'JSON',
success: function(response) {
$('.prodcount').html(response.total_quantity);
}
});
$.bootstrapGrowl('Product<strong>{{ Session::get("add-product") }}</strong> added to cart', {
  ele: 'body', // which element to append to
  type: 'info', // (null, 'info', 'danger', 'success')
  offset: {from: 'top', amount: 20}, // 'top', or 'bottom'
  align: 'center', // ('left', 'right', or 'center')
  width: 'auto', // (integer, or 'auto')
  delay: 4000, // Time while the message will be displayed. It's not equivalent to the *demo* timeOut!
  allow_dismiss: true, // If true then will display a cross to close the popup.
  stackup_spacing: 10 // spacing between consecutively stacked growls.
});
return false;
});
});

Answer 1

针对我的情况，您可以找到此问题的解决方案。

Laravel 闪光弹窗通知

Laravel flash popup notifications

ajax

jquery

popup

laravel