Laravel AJAX提交表单遇POST方法不支持错误，求无刷新增查方案

错误原因分析 #

提示The POST method is not supported for route admin/bill，核心原因是表单默认提交到了当前GET路由admin/bill，而你的AJAX事件绑定逻辑错误，既没有正确阻止表单默认提交行为，也没有将请求指向指定的POST路由admin/billing/add。

分步修复方案 #

1. 修复AJAX事件绑定错误 #

按钮元素不存在onsubmit事件，应绑定表单的submit事件，同时修正jQuery语法错误：

<script>
    jQuery('#addProduct').submit(function(e){
        e.preventDefault(); // 彻底阻止表单默认提交行为
        var formData = jQuery(this).serialize();
        $.ajax({
            url: "{{ route('admin.bill.add') }}",
            type: "POST",
            data: formData,
            success: function(response){                                    
                console.log(response);
                // 此处可添加查询结果渲染逻辑，比如更新页面账单列表
            },
            error: function(xhr){
                console.log(xhr.responseText); // 打印错误信息方便调试
            }
        });
    });
</script>

2. 补充表单缺失的必填字段 #

控制器验证要求customer_name、mobile_number、current_date、current_time、bill_number，但原表单未包含这些字段，需补充（可根据需求设置为隐藏或显示）：

<form method="post" id="addProduct">
    @csrf
    <!-- 自动填充日期时间，可改为用户输入 -->
    <input type="hidden" name="current_date" value="{{ date('Y-m-d') }}">
    <input type="hidden" name="current_time" value="{{ date('H:i:s') }}">
    
    <div class="row">
        <!-- 新增必填客户与账单号字段 -->
        <div class="col-3">
            <div class="form-group">
                <label>Customer Name <b>*</b></label>
                <input type="text" class="form-control" name="customer_name" placeholder="Customer Name" required>
            </div>
        </div>
        <div class="col-3">
            <div class="form-group">
                <label>Mobile Number <b>*</b></label>
                <input type="text" class="form-control" name="mobile_number" placeholder="Mobile Number" required>
            </div>
        </div>
        <div class="col-3">
            <div class="form-group">
                <label>Bill Number <b>*</b></label>
                <input type="text" class="form-control" name="bill_number" placeholder="Bill Number" required>
            </div>
        </div>
        
        <!-- 原有的产品相关字段保持不变 -->
        <div class="col-2">
            <div class="form-group">
                <label>Product Name <b>*</b></label>
                <input type="text" class="form-control" name="product_name" id="product_name" placeholder="Product Name">
            </div>
        </div>
        <!-- 其余原字段省略... -->
        <div class="col-1">
            <div class="form-group">
                <button class="btn btn-success" id="add">Add</button>
            </div>
        </div>
    </div>
</form>

3. 修复控制器逻辑问题 #

原控制器中$billingProduct变量在首次保存分支中未定义，会导致JSON返回报错，同时优化冗余逻辑：

public function billadd(Request $request){
    $request->validate([
        'customer_name'=>'required',
        'mobile_number'=>'required',
        'current_date'=>'required',
        'current_time'=>'required',
        'bill_number'=>'required',
        'product_name'=>'required',
        'batch_number'=>'required',
        'variant'=>'required',
        'price'=>'required',
        'quantity'=>'required',
        'tax_percent'=>'required',            
    ]);

    $posBill = new PosBilling();
    // 赋值基础字段
    $posBill->customer_name = $request->customer_name;
    $posBill->customer_phone = $request->mobile_number;
    $posBill->billing_date = $request->current_date;
    $posBill->billing_time = $request->current_time;
    $posBill->bill_number = $request->bill_number;
    $posBill->product_name = $request->product_name;
    $posBill->batch_number = $request->batch_number;
    $posBill->variant = $request->variant;

    // 计算金额相关字段
    $unitPrice = $posBill->price = $request->price;
    $totalQuantity = $posBill->quantity = $request->quantity;
    $posBill->quantity_value = $unitPrice * $totalQuantity;

    // 折扣计算（处理空值）
    $discountPercent = $posBill->discount_percent = $request->discount_percent ?? 0;
    $posBill->discount_amt = $posBill->quantity_value * ($discountPercent / 100);
    $posBill->amount_with_discount = $posBill->quantity_value - $posBill->discount_amt;

    // 税费计算
    $taxPercent = $posBill->tax_percent = $request->tax_percent;
    $posBill->tax_amount = $posBill->amount_with_discount * ($taxPercent / 100);
    $posBill->net_amount = $posBill->amount_with_discount + $posBill->tax_amount;

    $posBill->save();

    // 直接查询当前账单号的所有数据
    $billingProduct = PosBilling::where('bill_number', $request->bill_number)->get();
        
    return response()->json(['billingProduct'=>$billingProduct]);
}

4. 验证路由配置 #

确保路由配置正确，POST路由admin/billing/add可正常访问：

// routes/web.php
use App\Http\Controllers\BillingController;

Route::get('admin/bill',[BillingController::class, 'bill'])->name('billing');
Route::post('admin/billing/add',[BillingController::class, 'billadd'])->name('admin.bill.add');

无刷新查询实现示例 #

在AJAX的success回调中，可将返回的账单数据渲染到页面表格：

success: function(response){                                    
    var table = $('#billItemsTable');
    table.empty(); // 清空原有内容
    response.billingProduct.forEach(function(item){
        table.append(`
            <tr>
                <td>${item.product_name}</td>
                <td>${item.batch_number}</td>
                <td>${item.quantity}</td>
                <td>${item.net_amount}</td>
            </tr>
        `);
    });
}

内容的提问来源于stack exchange，提问作者M kumar