如何使用ajax添加注释，而不刷新以在laravel中查看新注释

Question

我成功地向数据库添加了新评论，但为什么必须刷新页面才能看到新评论。 我对此问题感到困惑。 哪里是我的代码的一部分错了？

这是我的代码。

路线

Route::post('blog/{post}/comments/store', 'AuthMember\CommentController@store')->name('comment.add');

评论控制器注意：我使用hash在post id上使用decode。

public function store(Requests\CommentStoreRequest $request)
{

    if($request->ajax()){
        $comment       = new Comment;
        $comment->body = $request->get('comment_body');
        $comment->user()->associate($request->user('member'));

        $key    = $request->get('post_id');
        $result = Hashids::connection('main')->decode($key)[0];
        $post   = Post::find($result);

        $post->comments()->save($comment);
        $response = array(
            'status' => 'success',
            'msg' => 'comment has been added',
        );
        return Response::json($response);

    }


}

形式评论

{!! Form::open(array(
                            'route'  => ['comment.add', $post->slug],
                            'method' => 'POST',
                            'id'     => 'form',
                            'name'   => 'form',
                            'data-parsley-validate'))
                        !!}



                            <div class="form-group {{ $errors->has('comment_body') ? 'has-error': '' }}">
                                {!! Form::textarea('comment_body', null, array(
                                    'class'       => 'form-control elastic',
                                    'id'          => 'comment_body',
                                    'rows'        => '3',
                                    'name'        => 'comment_body',
                                    'placeholder' => 'Write Something...',
                                    'required', 'minlength="4"')
                                    )

                                !!}

                                @if($errors->has('comment_body'))
                                    <span class="help-block">{{$errors->first('comment_body')}}</span>
                                @endif


                                <input type="hidden" name="post_id" value="{{ $parameter }}" />
                            </div>

                            <div class="form-group">
                                {!! Form::submit('Submit', array(
                                    'name'    => 'submit',
                                    'class'   => 'btn btn-primary',
                                    'id'      => 'btnComments'
                                    )) !!}

                            </div>

                        {!! Form::close() !!}

ajax，所以这是我将ajax存储到数据库中的新注释

<script>
$(document).ready(function(){
    var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
    $('#form').on('submit', function(event) {
        event.preventDefault();
        var form = $(this);
        var url = form.attr('action');
        $.ajaxSetup({
            headers: { 'X-CSRF-Token' : $('meta[name=_token]').attr('content') }
        });
        $.ajax({
            // url: '{{route('comment.add',[$post->slug])}}',
            url: url,
            type: 'POST',
            data: form.serialize(),
            dataType: 'JSON',
            success: function (data) {
                console.log(data);
            },
            error: function(data){
                console.log(data);
            }
        });
    });
});
</script>

Answer 1

您重定向为：

return redirect()->to(app('url')->previous(). '#comments')->with('message-post', 'Comment has been added');

尝试将JSON返回为：

return response()->json(["success"=>"true", "message"=>"Comment has been added"]);