Laravel 中的 AJAX 功能未将表单数据发布到控制器

Question

我在 Laravel 中有一个表单，用户可以在其中购买产品。我试图在不刷新页面的情况下动态实现这一点。我可以正常调用 AJAX 函数，但它没有将数据发布到控制器，我需要帮助。控制器中的所有内容都工作得非常好，只是数据没有发送到它。

这是 HTML 表单

<form class="buy-product-form" id="{{$product->id}}" action="/UoE/buy-product/{{$product->id}}" method="POST">
                                    {{csrf_field()}}
                                    <button class="pull-right btn btn-primary">BUY NOW</button>
                                </form>

这是我的AJAX函数

$(document).ready(function(){
            $('form.buy-product-form').on('submit', (function (e) {
                e.preventDefault();
                var product_id = $(this).closest("form").attr("id");
                $.ajax({
                    url: $(this).closest("form").attr('action'),
                    type: 'POST',
                    data: {'id': product_id},
                    dataType: 'JSON',
                    success: function () {
                        window.alert(url);
                    }
                });
            }));
        });

这是控制器中的前几行

 public function buyProduct($university_code, $product_id){
        $player = Player::where('user_id', Auth::user()->id)->first();
        $product = Product::where('id', $product_id)->first();
        $totalPrice = $product->quantity_available * $product->price; 

Answer 1

我刚刚经历了在 Laravel 中通过 AJAX 进行 POSTing 的头痛。我有与你类似的代码，但它不起作用。我所做的一些更改：

<form>

标签没有任何操作。

<form id="contact-form" class="main-form">

<button>

标签：

<button class="btn btn-primary submit-button" type="button">Submit</button>

AJAX 调用：

$(document).ready(function() 
{
    $(".submit-button").click(function(e){            
        form_data = $("form").serialize()
        $.ajax({
            url: "/contact",
            type: "POST",
            data: form_data,
            success: function(data) 
            {
                if ($.isEmptyObject(data.error))
                {
                    handleSuccess(data.success);
                }
                else
                {
                    handleError(data.error);
                }
            }
        });
    });
});

Answer 2

您的控制器操作需要 2 个参数

buyProduct($university_code, $product_id)

，但在表单操作中您仅传递产品 ID。

Answer 3

您没有将请求对象传递给控制器，但您已声明它需要两个参数。 在路由中，您只需指定一个参数 (

$product->id

)。 根据我的猜测，控制器方法应该如下所示：（已编辑）

public function buyProduct(Request $request){
        $product_id=$request->id; //could also be $product_id=$request()->id;
    }

访问

Request $request

对象或

request()

帮助程序以获取发布到控制器的数据。

帖子网址：

url: $(this).closest("form").attr('action')

已经翻译为

/UoE/buy-product/{{$product->id}}

，所以那里已经有了

product->id

/

product_id

。

我的建议是将您的路线更改为最像帖子的路线

/UoE/buy-product

并传递数据（product_id和csrf令牌）

$(document).ready(function(){
            $('form.buy-product-form').on('submit', (function (e) {
                e.preventDefault();
                var product_id = $(this).closest("form").attr("id");

                //doesn't matter which csrf, they're all the same
                var csrf=document.querySelector("input[name='_token']").getAttribute('value'); 

                $.ajax({
                    url: '/UoE/buy-product',
                    type: 'POST',
                    data: {
                        'id': product_id,
                        '_token':csrf //pass CSRF
                    },
                    dataType: 'JSON',
                    success: function () {
                        window.alert(url);
                    }
                });
            }));
        });

Answer 4

您似乎无法提交表单，因为您的按钮不是提交按钮。