我已经设置了评论,并且显然要在第一个评论中添加评论的原因。因此所有回复都转到第一个评论。我在模态上有输入隐藏字段。
问题出在模式上,当我单击按钮并打开模式时,$ comment-> id从11更改为13。这是实际的https://imgur.com/s9iRVnb
blade.php
@foreach($comments as $comment)
<div class="comment-wrap">
<div class="photo">
<div class="avatar" style="background-image: url('/images/frontend_images/uploads/{{$comment->user->avatar}}')"></div>
</div>
<div class="comment-block">
<p class="comment-text">{{$comment->body}}
</p>
<div class="bottom-comment">
<div class="comment-date"><a href="{{route('profile_posts_path',$comment->user_id)}}">{{$comment->user->username}}</a> on {{$comment->created_at->format('l jS \\of F Y h:i:s A')}}</div>
<ul class="comment-actions">
<li class="complain">{{$comment->created_at->diffForHumans()}}</li>
<li class="reply"><button type="button" class="btn btn-outline-primary btn-mini" data-toggle="modal" data-target="#reply" >Reply {{$comment->id}}
</button>
</li>
<!-- Modal -->
<div class="modal fade" id="reply" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Reply to a Comment</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method="post" action="{{ route('reply.add') }}">
@csrf
<div class="form-group">
<textarea name="comment_body" id="comment_body" cols="60" rows="3" placeholder="Type your comment here...."></textarea>
<input type="hidden" name="blog_id" value="{{ $blog->id }}" />
<input type="text" name="comment_id" value="{{$comment->id}}" />
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</div>
</ul>
</div>
</div>
<!-- Button trigger modal -->
</div>
@if($comment->replies)
@foreach($comment->replies as $rep)
<div class="comment-wrap" style="margin-left:50px;width:710px;">
<div class="photo">
<div class="avatar" style="background-image: url('/images/frontend_images/uploads/{{$rep->user->avatar}}')"></div>
</div>
<div class="comment-block">
<p class="comment-text">{{$rep->body}}
</p>
<div class="bottom-comment">
<div class="comment-date"><a href="{{route('profile_posts_path',$rep->user_id)}}">{{$rep->user->username}}</a> on {{$rep->created_at->format('l jS \\of F Y h:i:s A')}}</div>
<ul class="comment-actions">
<li class="complain">{{$rep->created_at->diffForHumans()}}</li>
</ul>
</div>
</div>
</div>
@endforeach
@endif
@endforeach
I want the reply on the particular comment..
答案 0 :(得分:0)
您为每个评论都做了一个模态,我认为不需要。一个就足够了,但是即使您希望保留它们,它们也应该具有唯一的ID,如果给它们“相同的ID dom将使第一个元素具有ID”,我认为最好将注释ID传递给模态并只创建一个。 / p>
@foreach($comments as $comment)
<div class="comment-wrap">
<div class="photo">
<div class="avatar" style="background-image: url('/images/frontend_images/uploads/{{$comment->user->avatar}}')"></div>
</div>
<div class="comment-block">
<p class="comment-text">{{$comment->body}}</p>
<div class="bottom-comment">
<div class="comment-date">
<a href="{{route('profile_posts_path',$comment->user_id)}}">
{{$comment->user->username}}
</a> on {{$comment->created_at->format('l jS \\of F Y h:i:s A')}}
</div>
<ul class="comment-actions">
<li class="complain">{{$comment->created_at->diffForHumans()}}</li>
<li class="reply">
<!-- Button trigger modal -->
<button type="button" class="reply-modal btn btn-outline-primary btn-mini" data-toggle="modal" data-target="#reply" >Reply {{$comment->id}}
</button>
</li>
</ul>
</div>
</div>
</div>
@if($comment->replies)
@foreach($comment->replies as $rep)
<div class="comment-wrap" style="margin-left:50px;width:710px;">
<div class="photo">
<div class="avatar" style="background-image: url('/images/frontend_images/uploads/{{$rep->user->avatar}}')"></div>
</div>
<div class="comment-block">
<p class="comment-text">{{$rep->body}}</p>
<div class="bottom-comment">
<div class="comment-date">
<a href="{{route('profile_posts_path',$rep->user_id)}}">{{$rep->user->username}}</a> on {{$rep->created_at->format('l jS \\of F Y h:i:s A')}}
</div>
<ul class="comment-actions">
<li class="complain">{{$rep->created_at->diffForHumans()}}</li>
</ul>
</div>
</div>
</div>
@endforeach
@endif
@endforeach
<!-- Modal -->
<div class="modal fade" id="reply" tabindex="-1" role="dialog" aria-labelledby="replyModal" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<form method="post" action="{{ route('reply.add') }}">
<div class="modal-header">
<h5 class="modal-title" id="replyModal">Reply to a Comment</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
@csrf
<div class="form-group">
<textarea name="comment_body" id="comment_body" cols="60" rows="3" placeholder="Type your comment here...."></textarea>
<input type="hidden" name="blog_id" value="{{ $blog->id }}" />
<input id="comment_id" type="text" name="comment_id" value="" />
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</form>
</div>
</div>
</div>
然后您可以通过一个简单的jquery脚本传递评论ID:
$(document).on("click", ".reply-modal", function () {
var commentId = $(this).data('id');
$(".modal #reply #comment_id").val( commentId );
// it is unnecessary to have to manually call the modal.
// $('#reply').modal('show');
});