添加来自 yajra 数据表的表单输入数据 laravel

Question

我想从数据表数据创建一个表单输入。 我尝试从数据表中遵循这个 link：https://datatables.net/examples/api/form.html

但我的程序没有 运行 正确（我得到 GET http://127.0.0.1:8000/claim/addClaimDetail/13?qty%5B%5D=&billed%5B%5D=&exclude%5B%5D=&prorate%5B%5D=&qty%5B%5D=&billed%5B%5D=&exclude%5B%5D=&prorate%5B%5D=&qty%5B%5D=&billed%5B%5D=&exclude%5B%5D=&prorate%5B%5D=&qty%5B%5D=&billed%5B%5D=&exclude%5B%5D=&prorate%5B%5D=&qty%5B%5D=8&billed%5B%5D=8&exclude%5B%5D=8&prorate%5B%5D=8 405（方法不允许））

为什么会出现此错误，因为我必须为此方法添加路由 (post)，并且我必须使此按钮具有 post 方法？

blade形式

<form method="post">
                                    @csrf
                                    @method('POST')
                                    <table width="100%" id="claimAddDetailTable"
                                        class="table table-bordered table-striped claim-add-detail-table">
                                        <thead>
                                            <tr>
                                                <th>{{ __('Benefit ID') }}</th>
                                                <th>{{ __('Benefit') }}</th>
                                                <th>{{ __('Start Date') }}</th>
                                                <th>{{ __('End Date') }}</th>
                                                <th>{{ __('Qty') }}</th>
                                                <th>{{ __('Billed') }}</th>
                                                <th>{{ __('Exclude') }}</th>
                                                <th>{{ __('Prorate') }}</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        </tbody>
                                    </table>

                                    <input type="button" class="btn btn-success" id="submit_addclaimdetail"
                                        value="Save">
                                </form>

ajax 处理

$(function() {
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });

                const url = window.location.href;
                const lastSegment = url.split("/").pop();
                console.log(lastSegment);
                // Data table
                var table_addclaimdetail = $('.claim-add-detail-table').DataTable({
                    processing: true,
                    serverSide: true,
                    responsive: true,
                    ajax: "/claim/claimAddDetail/" + lastSegment,
                    dom: '<"top"fB>rt<"bottom"lip><"clear">',
                    columns: [{
                            data: 'benefitID',
                            name: 'benefitID'
                        },
                        {
                            data: 'name',
                            name: 'name'
                        },
                        {
                            data: 'p_date',
                            name: 'p_date'
                        },
                        {
                            data: 'pp_date',
                            name: 'pp_date'
                        },
                        {
                            data: 'qty',
                            name: 'qty'
                        },
                        {
                            data: 'billed',
                            name: 'billed'
                        },
                        {
                            data: 'exclude',
                            name: 'exclude'
                        },
                        {
                            data: 'prorate',
                            name: 'prorate'
                        },
                    ],
                    "lengthMenu": [
                        [10, 25, 50, -1],
                        [10, 25, 50, "All"]
                    ],
                });

                // start submit add claim detail
                $('#submit_addclaimdetail').click(function() {
                    var data = table_addclaimdetail.$('input').serialize();


                    // Submit form data via Ajax
                    $.ajax({
                        url: '/claim/addClaimDetail/{{ $claim->cno }}',
                        data: data,
                        success: function(data) {
                            console.log('Server response', data);
                        }
                    });
                    // alert(
                    //     "The following data would have been submitted to the server: \n\n" +
                    //     data.substr(0, 120) + '...'
                    // );
                    // return false;
                });
            });

路线

Route::post('/claim/addClaimDetail/{cno}', [ClaimDetailController::class, 'storeClaimDetail']);

Answer 1

当您通过Ajax提交表单数据时，您应该添加方法：“POST”。

$.ajax({
    url: '/claim/addClaimDetail/{{ $claim->cno }}',
    method: 'POST',
    data: data,
    success: function(data) {
        console.log('Server response', data);
    }
});