-1

我正在尝试将LaravelShoppingCartPNotify一起使用,但我有点迷茫,可以使用一些指针。

这是我到目前为止的界面:在此处输入图像描述

当我单击黄色的“添加我”按钮时,我会使用右上角的 PNotify 生成一个新通知,就像您在图片中看到的那样。

接下来我想做的是:

  1. 当我单击“添加我”按钮时,Cart::add()将被调用,并且我的课程将被添加到购物车会话中

  2. 黄色按钮变为“删除我”,这将能够调用Cart::remove()

  3. 通知仍然存在于右上角(即使您转到另一个页面。它本质上是引用Cart::content()),并且当您单击通知上的“x”按钮时,它也会调用Cart::remove()

我并不是真的在寻找代码(尽管如果它有助于解释,请随意)。我只是希望有人向我解释我如何实现这一目标。

看来我需要使用 AJAX。如果是这样,我需要向我的 Laravel 项目添加什么才能使用 AJAX 添加到购物车?

4

1 回答 1

0

不一定你需要ajax。每次单击“添加我”按钮时,您只需发送一个帖子请求并使用 Cart::add() 将课程添加到您的购物车。您可以通过列出 Cart::content() 来显示添加的类。如果已经添加了类,您还可以检查您的视图,然后更改按钮以删除类。

如果你更喜欢ajax。然后您只需使用与提及相同的过程向您的服务器发送一个 ajax 调用。您不必将包添加到项目中即可使用 ajax。你只需要 jquery 插件。

我更喜欢 ajax,因为您不必加载页面,但它需要大量工作。

更新

你需要这样的东西。

$('#button').click(function(){

$.ajax({
  type: 'post',
  url: 'url',
  data: {your: data},
  dataType: 'json'
}).done(function(data){
 //do something with your data
});

return false;

});

笔记

在你的 ajax 函数中。如果您提交表单,它应该看起来像这样。

 $.ajax({
    type: "post",
    url: "{!! route('route') !!}",
    data: $('#form').serialize(),
    dataType: 'html'
 }).done(function (data) {

但如果您只是传递选定的数据,则需要传递 _token。

$.ajax({
    type: "post",
    url: "{!! route('route') !!}",
    data: {data: value, _token: "{{ csrf_token() }}"},
    dataType: 'html'
 }).done(function (data) {

更新

这是我的后端示例代码。

public function addItem(Request $request)
    {
        $data = $request->all();

        $validator = Validator::make($data, [
            'field' => 'required'
        ]);

        if ($validator->fails())
        {
            $data = Cart::content();
            return view('errorview', compact('data'))->withErrors($validator);
        }

        Cart::add($data['id'], $data['name'], $data['qty'],
            $data['amount']);

        $data = Cart::content();

        return view('myview', compact('data'));
    }

更新

您需要在所有按钮中添加一个类。像这样的东西。

 $('.btn').click(function () {
                $.ajax({
                    type: 'post',
                    url: "{!! route('route') !!}",
                    data: {id: $(this).prop('id').substr(9), _token: "{{ csrf_token() }}"},
                    dataType: "html"
                }).done(function (data) {
                   //more code here
                });
                return false;
            });
于 2015-08-04T23:31:47.000 回答