使用Laravel 5和Bootstrap可编辑的内联编辑:405方法不允许

时间:2015-10-22 15:36:13

标签: jquery ajax laravel laravel-5 x-editable

我在我的应用中的每个帖子上都有一个评论表单和列表,我刚刚导入了Bootstrap Editable,以便能够让用户有机会在没有页面重新加载的情况下内联编辑他们的评论。

但我一直收到这个错误

  

RouteCollection.php第219行中的MethodNotAllowedHttpException:

     

POST http://localhost/r2/public/posts/comment/update 405(方法不允许)

我假设它与我的评论路线有关,但我无法弄清楚是什么。

编辑:将type: 'post'添加到ajaxOptions后,我开始收到其他错误

  

从空值创建默认对象

似乎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');
Update()

中的

CommentController方法

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));
}

视图

<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>

2 个答案:

答案 0 :(得分:2)

正如我所提到的,当你使用不同的HTTP动词时,会抛出MethodNotAllowedHttpException。我的意思是,在您的路线中,您使用post动词声明更新路线:

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

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

ajaxOptions: type: 'post'

现在,另一个错误来了。您没有传递路由定义中预期的post id,这就是您收到空id的原因,因此,从数据库返回一个空对象。所以,你必须把它作为传递。但首先,我们可以为每个评论稍微更改一下标记,以便通过data-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将自动捕获urlpk值,而不会显式设置。你的最终代码应该是这样的:

$(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'
                }
            });
        }
    );

不要忘记路由中定义的每个参数都可以注入控制器的函数中。例如,您的路线正在定义一个{post},它应该是要编辑的帖子ID:

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

所以,在你的update()中注入参数:

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');

答案 1 :(得分:0)

使用带有laravel的xeditable的简单方法

HTML

<link href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/jqueryui-editable/css/jqueryui-editable.css" rel="stylesheet"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/jqueryui-editable/js/jqueryui-editable.min.js"></script> 

<div id="_token" class="hidden" data-token="{{ csrf_token() }}"></div>
<a href="#" id="industryName" data-type="text" data-pk="{{ $industry->id }}" data-title="Edit industry">{!! $industry->name !!}</a>

的Javascript

    $(document).ready(function() {

     $.fn.editable.defaults.mode = 'inline';

       $.fn.editable.defaults.params = function (params) 
       {
        params._token = $("#_token").data("token");
        return params;
       };

     $('#industryName').editable({
                validate: function(value) {
                                            if($.trim(value) == '') 
                                                return 'Value is required.';
                                            },
                type: 'text',
                url:'/updateIndustry',   
                send:'always',
                ajaxOptions: {
                dataType: 'json'
                }

                } );
 } );

laravel route

Route::post('/updateIndustry',  'SettingsController@updateIndustry');

laravel controller

public function updatePosition(Request $request)
    {
        $id= $request->pk;
        $position = $request->value;

        $count = DB::table('designations')->whereRAW("position LIKE '%".$position."%'")->where('id','!=',$id)->count();
        if($count)
            echo "Similar position exists.";

        else
        {
            DB::table('designations')->where('id',$id)->update(['position' => $position]);
            echo "1";
        }
   }