jquery - 使用 Laravel 5 和 Bootstrap Editable 进行内联编辑 : 405 Method Not Allowed

Question

我的应用程序中的每个帖子都有一个评论表单和列表，我刚刚导入了 Bootstrap Editable，以便用户能够在不重新加载页面的情况下内联编辑评论。

但我不断收到此错误

MethodNotAllowedHttpException in RouteCollection.php line 219:

POST http://localhost/r2/public/posts/comment/update 405 (Method Not Allowed)

我假设这与我的评论路线有关，但我不知道是什么。

编辑:将 type: 'post' 添加到 ajaxOptions 后，我开始收到不同的错误

Creating default object from empty value

似乎 Input::get('commenter_comment') 没有返回任何内容。我想这无论如何都是错误的，因为这不是出现的 X-Editable 字段。

如何获取 X-Editable 字段？

路线

Route::get('{post}/comment', ['as' => 'comment', 'uses' => 'CommentController@index']);
Route::post('{post}/post_this_comment', 'CommentController@post_this_comment');
Route::get('{post}/recaptcha', 'CommentController@recaptcha');
Route::get('{post}/reply_comment', 'CommentController@reply_comment');
Route::post('{post}/per_page', 'CommentController@per_page');
Route::post('{post}/comment/update', 'CommentController@update');

CommentController 中的 Update() 方法

public function update() {
    $commentId = Input::get('pk');

    $newComment = Input::get('commenter_comment');

    $commentData = Comment::whereId($commentId)->first();

    $commentData->comment = $newComment;

    if($commentData->save())
        return Response::json(array('status'=>1));
    else
        return Response::json(array('status'=>0));
}

View

<script type="text/javascript">
    $(document).ready(
        function(){
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            $('.testedit').editable({
                validate: function(value) {
                    if($.trim(value) == '')
                        return 'Value is required.';
                },
                type: 'textarea',
                url: 'comment',
                title: 'Edit Comment',
                placement: 'top',
                send:'always',
                ajaxOptions: {
                    dataType: 'json'
                }
            });
        }
    );
</script>

<p><a href="#" class="testedit" pk="{{ $each_comment->id }}">{!! $each_comment->comment !!}</a></p>

Answer 1

正如我所提到的，当您使用不同的 HTTP 谓词时，会引发 MethodNotAllowedHttpException 。我的意思是，在您的路由中，您使用 post 动词声明更新路由:

Route::post('{post}/comment/update', 'CommentController@update');

但是，在 ajax 选项中，当类型未定义时，它会在 GET 中执行请求，因此您必须定义它:

ajaxOptions: type: 'post'

现在，另一个错误出现了。您没有传递路由定义中预期的帖子 ID，这就是您收到空 ID 的原因，因此，从数据库返回一个空对象。因此，您必须将其传递为。但首先，让我们稍微更改一下每个评论的标记，以便通过 data-url 设置帖子的 url，并通过 data-pk 属性设置 pk:

<a 
href="#" 
class="testedit" 
data-pk="{{ $each_comment->id }}"
data-url="{!! url($post->id . '/comment/update') !!}">
    {!! $each_comment->comment !!}
</a>

现在，x-editable 将自动捕获 url 和 pk 值，无需显式设置。您的最终代码应该如下所示:

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

            $('.testedit').editable({
                validate: function(value) {
                    if($.trim(value) == '')
                        return 'Value is required.';
                },
                type: 'textarea',
                title: 'Edit Comment',
                placement: 'top',
                send:'always',
                ajaxOptions: {
                    dataType: 'json',
                    type: 'post'
                }
            });
        }
    );

不要忘记路由中定义的每个参数都可以注入(inject) Controller 的函数中。例如，您的路由定义了一个 {post} ，它预期是要编辑的帖子 ID:

Route::post('{post}/comment/update', 'CommentController@update'); 

因此，在您的 update() 中只需注入(inject)参数:

public function update(Request $request, $post) {
    //$post has the Id of post to be edited

    // catching pk id:
    $pk = $request->get('pk');

    // catching the new comment
    $comment = $request->get('value');