Ajax无法在Laravel 5.5上运行

Question

我刚刚开始学习Laravel 5.5，以探索一个“高级”框架。 我曾经使用Codeigniter并喜欢它。 现在，我正在实现一个小的CRUD功能，并且可以正常工作。 现在，我尝试使用Jquery AJAX，因此不必刷新。 我之前在以前的codeigniter项目中使用过Jquery AJax。 现在，当我使用Laravel尝试时，它不起作用。 我检查了许多参考资料，但不确定为什么它没有成功。 我正在尝试将其实现为Delete函数，如果可以正常运行，我敢保证其余的工作都可以完成。

问题：

1. 当我尝试删除它时，它会重定向到“ json”视图。 我认为那是因为return response ()->json ($post); 但是是的，该项目将删除。
2. 当我检查开发人员控制台时，没有发出AJAX请求。 我认为AJAX不会被调用，它直接进入表单的动作。

我希望它成为

1. AJAX有效。 无需刷新页面。

控制者

    public function destroy($id)
{
    $post = Post::find($id);
    if (auth()->user()->id !== $post->user_id){
      return redirect ('/posts')->with('error', 'Unauthorized page');
    }
    $post->delete();
    return response ()->json ($post);
}

路线

Route::resource('posts','PostsController');

视图

{!!Form::open(['action'=>['PostsController@destroy', $post->id], 'method'=>'POST', 'class'=>''])!!}
                            {{Form::hidden('_method', 'DELETE')}}
                            {{Form::button('Delete', ['type' => 'submit', 'class' => 'btn btn-danger delete','id' => 'delete', 'data-id' => $post->id ] )}}
                          {!!Form::close()!!}

JS

  <script type="text/javascript">
$(document).ready(function(){
  $(".delete").on('click',function(event){
    var id = $(this).attr('data-id');
    alert(id);
    $.ajax({
      url: "posts/"+id,
      type: "DELETE",
      success: function(){
        alert("DELETED");
      }
    });
  });
});
  </script>

非常感谢你的朋友！

Answer 1

问题是您要在触发REST调用之前提交表单，因此您的rest调用永远不会停止，但是页面会重新加载，因为表单已提交，然后显示了从控制器返回的json。

解

在刀片视图中删除Form 。 然后像这样更新ajax：

$(document).ready(function() {
   var id = {!! $post->id !!};
   $.ajax({
      url: "posts/"+id,
      type: "DELETE",
      contentType: 'application/json',
      success: function(data) {
         console.log(data);
         alert("DELETED");
      }
   });
});