蓝鲸Django: 删除及回复评论功能的实现

来自CloudWiki
跳转至: 导航搜索

后台删除功能的实现

a)View 中编写删除函数:

@login_required
def delete_comment(request):
    comment_id = request.POST.get("comment_id")
    Reply.objects.filter(id=comment_id).delete()
    return JsonResponse({"result":True})

b) urls.py:

。。。
from moments.views import like,comment,delete_comment
urlpatterns = [
  。。。
   path('comment/delete',delete_comment),
]


前端删除功能的实现

编写删除确认弹窗

注意整个modal 为了使用方便,加个id号:id="deleteConfirm"

 <!-- Modal -->
    <div class="modal fade" id="deleteConfirm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
            <h4 class="modal-title" id="myModalLabel">删除确认</h4>
          </div>
          <div class="modal-body">
               <textarea class="form-control" rows="5" id="text"> </textarea>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            <button type="button" class="btn btn-primary" onclick="comment()">删除</button>
          </div>
        </div>
      </div>
    </div>

编写delete_or_comment 函数

并绑定到comment 的<p>标签:

Bd20-5-59.png

function delete_or_comment(comment_id,user,comment_user,status_id) {
            if (user === comment_user) {
                $("#deleteConfirm").modal()
                 $("#deleteConfirm").attr("comment_id",comment_id)
            }else {
                show_dialog(status_id)
                $("#myModal").attr("comment_at",comment_user)
                $("#myModal").find("textarea").attr("placeholder","@"+comment_user)
            }
        }
 {% for comment in status.comments %}
                        <p style="font-size:30px" onclick="delete_or_comment('{{ comment.id }}','{{user }}','{{ comment.author }}', '{{ status.id}}')">
                            {{ comment.author }}
                            {% if comment.at_person %}@{{ comment.at_person }}
                            {% endif %}: {{ comment.text }}
                        </p>
                    {% endfor %}

效果图

点击自己的评论时

Bd20-5-60.png


点击别人的评论时:

Bd20-5-61.png