使用ajax

时间:2019-06-17 10:49:51

标签: javascript php jquery ajax laravel

我有一个表单,该表单中已向用户提供选项以留下comment,我使用了ajax来完成此操作,注释已成功添加到数据库中,并且没有错误在console中,但是我无法检索使用Ajax完成的评论。

问题是评论已通过DB添加到ajax,但未使用DBajax检索。”

我在form的{​​{1}}循环中有foreach

home.blade.php

上方代码区域的最后一部分,您可以看到该表单,当该表单提交时,我将收到此 Ajax请求

@foreach($posts as $post) <div class="card"> <div class="container" style="padding: 10px;"> <div class="col-md-12"> <div class="media"> <div class="media-left" style="margin-left:16px;"> <img src="{{asset('uploads/avatars/'.$post->user->avatar)}}" class="media-object" style="width:60px;height: 60px;border-radius: 50%;"> </div> <div class="media-body card"> <h4 class="media-heading">{{$post->user->name}}</h4> <small>{{$post->created_at}}</small> <p>{{$post->description}}</p> <!-- trying to retrieve comments with each post --> @if(count($post->comments)) @foreach($post->comments as $comment) <small> <img src="{{asset('uploads/avatars/'.$comment->user->avatar)}}" style="width:40px;height: 40px;border-radius: 50%;" alt=""></small> <small>{{$comment->user->name}}</small> <small>{{$comment->body}}</small> @endforeach @else No comments Found @endif --> <div class="image_{{$post->id}}"></div> <div class="name_{{$post->id}}"></div> <div class="show_comments_{{ $post->id }}"></div> <!-- </div> --> <!-- here we need form --> <div class="combine"> <span><img src="{{asset('uploads/avatars/'.Auth::user()->avatar)}}" style="width:40px;height: 40px;border-radius: 50%;" alt=""></span> <form action="{{ url('comment',$post->id) }}" method="POST" > @csrf <textarea name="body" placeholder="Write A Suggestion" data-autosize-input='{ "space": 100 }' rows="50" cols="100" name="comment" style="height:50px;float:left;" class="form-control comment body"> </textarea> <input type="hidden" value="{{csrf_token()}}"> <!-- user Id of the logged In one --> <input type="hidden" class="user_id" value="{{Auth::user()->id}}" name="user_id"> <!-- post id --> <input type="hidden" name="id" class="id" value="{{$post->id}}"> <button type="button" class="btn btn-sm btn-danger formcomment" value = 'Comment' style="margin:10px;">Comment</button> </form> </div> </div> </div> </div> </div> </div> @endforeach

Ajax Request

Ajax请求<script type="text/javascript"> $(document).ready(function(){ $('.formcomment').on('click', function(e) { e.preventDefault(); var form = $(this).closest('form'); // these are id's var body = form.find('.body').val(); var id = parseInt(form.find('.id').val()); // this is post_id var user_id = parseInt(form.find('.user_id').val()); // alert(post_id); // alert(body); // alert('this is post'+post_id); // alert('This is user id'+user_id); var folder = 'uploads/avatars/'; var i = 1; $.ajax({ type: "POST", url: '/comment/'+id, dataType: 'json', data: {body:body, id:id, user_id:user_id, _token: '{{csrf_token()}}'}, success: function(data) { var i = 0 $(".image_"+id).append( "<img style = 'width:30px;height:30px;border-radius:50%;' src='"+ folder + data.user_image +"'>" ) $(".name_"+id).append(data.name) $(".show_comments_"+id).append(data.msg) } }); $('.body').val(''); if(i== 0){ alert('success'); } else{ alert('failure'); } }); }); 发送到url,就是这样。

/comment/+id

/comment/+id

public function storeComments(Request $request,Comment $body,$post_id){ if($request->ajax()){ echo "<script>alert('Inside controller ajax')</script>"; $comment = new Comment; $comment->user_id = Auth::user()->id; $comment->post_id = $post_id; $comment->body = Input::get('body'); $comment->save(); return response()->json(['msg'=>$comment->body,'name' =>Auth::user()->name, 'user_image' => Auth::user()->avatar]); } } 已返回,我已将该响应附加到response()->json()中,然后您可以看到我在{中的divs上方的divs {1}}。

这是路线

form

]);

代码中的问题出在哪里,就像我提到的那样,问题是通过home.blade.php添加到Route::post('comment/{id}',[ 'uses' => 'CommentController@storeComments' 的,但不是通过ajax从DB检索的。

尽管您可以看到我已经退回ajax,然后将其数据附加到我的DB

控制台结果:

enter image description here

请帮助,谢谢

0 个答案:

没有答案