jQuery-Tabledit引发MethodNotAllowedHttpException

时间:2018-10-07 09:02:30

标签: jquery laravel datatables jquery-plugins

我正在尝试实现jQuery-Tabledit插件来处理内联表字段编辑。问题在于它没有向控制器发送数据(传递参数),并且抛出了错误MethodNotAllowedHttpException“ No message”。我是javascript新手,所以请描述我做错了什么。 这是我的控制器代码(首先我想显示脚本发送的参数):

public function quantityUpdate(Request $request){    
        dd($request->all());
    }

这是我的路线:

Route::post('quantityUpdate', ['as' => 'quantityUpdate', 'uses' => 'QuantityController@quantityUpdate']);

查看文件中的脚本:

<script src="{{ asset('js/jquery.tabledit.js') }}"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $('#products_table').Tabledit({
                url: '{{route('quantityUpdate')}}',             
                columns: {
                    identifier: [0, 'id'],
                    editable: [[4, 'quantity']]
                },
                editButton: false,
                deleteButton: false,
                saveButton: false,
                restoreButton: false,
                onSuccess: function(data, textStatus, jqXHR) {

                },
                onFail: function(jqXHR, textStatus, errorThrown) {

                },
                onAjax: function(action, serialize) {

                    console.log("on Ajax");
                    console.log("action : ", action);
                    console.log("data : ", serialize);
                }
            });
        });

还有我的桌子:

<table class="table table-hover datatable" id="products_table">
                    <thead>
                    <tr>
                        <th>#</th>
                        <th>Name</th>
                        <th>Quantity</th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($items as $item)
                        <tr>
                            <td>{{ $item->id }}</td>
                            <td>{{ $item->name }}</td>
                            <td id="quantity">{{ $item->quantity }}</td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>

控制台输出:

on Ajax
action :  edit
data :  id=5&quantity=111140&action=edit
ReferenceError: exception is not defined

谢谢您的帮助! :)

1 个答案:

答案 0 :(得分:1)

尝试一下。

将路由重写为以下内容:

Route::post('/quantityUpdate', 'QuantityController@quantityUpdate');

在您的视图文件脚本中,更改为以下内容:

$('#products_table').Tabledit({ 
url: '/quantityUpdate', 
columns: { 
identifier: [0, 'id'], 
editable: [[4, 'quantity']] 
}, 

onSuccess: function(data, textStatus, jqXHR) { 
console.log(data); 
}, 
onFail: function(jqXHR, textStatus, errorThrown) { 

}, 
onAjax: function(action, serialize) { 

console.log("on Ajax"); 
console.log("action : ", action); 
console.log("data : ", serialize); 
} 
});

在您的VerifyCsrfToken.php文件中:

protected $except = [
        '/quantityUpdate'
    ];

最后,在您的quantumUpdate控制器中,将代码更改为:

\Log::info($request->all());

那应该可行。