Django 项目试炼blog(8) -- 评论树的显示

Views

def get_tree_data(request):
    article_id = request.GET.get(‘article_id‘)
    send_data = list(Comment.objects.filter(article_id=article_id).values(‘pk‘,‘content‘,‘parent_comment_id‘))

    return JsonResponse(send_data,safe=False)

ORM生成的的是queryset对象,而非真正的集合对象。

JsonResponse传输list对象,需要添加safe属性



HTML

 <div class="list-group">
            <p class="tree">评论树</p>
            <div class="comment_tree"></div>

        </div>

        <script>
            $(‘.tree‘).click(function () {
                $.ajax({
                    url:‘/get_tree_data/‘,
                    type:"get",
                    data:{
                        ‘article_id‘:{{ art_obj.pk }}
                    },
                    success:function (data) {
                        console.log(data);
                        $.each(data,function (index,comment_obj) {
                            var pk = comment_obj.pk;
                            var content = comment_obj.content;
                            var parent_comment_id = comment_obj.parent_comment_id;
                            var s = ‘<div class="tree_item" comment_id=‘+pk+‘><span>‘+content+‘</span></div>‘;

                            if(!parent_comment_id){
                                $(‘.comment_tree‘).append(s)
                            }else{
                                $(‘[comment_id=‘+parent_comment_id +‘]‘).append(s)
                            }

                        })
                    }
                })
            })
        </script>

1、自定义标签属性,给父评论追加标识

2、利用jquery的属性选择器,追加样式



Django 项目试炼blog(8) -- 评论树的显示

原文地址:https://www.cnblogs.com/zhuzhiwei-2019/p/10777314.html

时间: 2024-11-08 17:01:34

Django 项目试炼blog(8) -- 评论树的显示的相关文章

Django 项目试炼blog(7) -- 文章详情页2 -- 前端样式的继承与楼评论显示

views from django.db import transaction def comment(request): article_id = request.POST.get('article_id') content = request.POST.get('content') pid = request.POST.get('parent_id') #事务操作 生成评论,文章数据中评论总数自动+1(同时执行) with transaction.atomic(): comm_obj = C

django 项目试炼blog(1)

1.确定表结构 from django.contrib.auth.models import AbstractUser class UserInfo(AbstractUser): """ 用户信息表, 继承session生成的auth_user表 需要在setting中加入 AUTH_USER_MODEL = 'app01.UserInfo' """ nid = models.AutoField(primary_key=True) telepho

Django 项目试炼blog(10) --补充 滑动验证码

首先安装一个需要用到的模块 pip install social-auth-app-django 安装完后在终端输入pip list会看到 social-auth-app-django 3.1.0 social-auth-core 3.0.0 然后可以来我的github,下载关于滑动验证码的这个demo:https://github.com/Edward66/slide_auth_code 下载完后启动项目 python manage.py runserver 启动这个项目后,在主页就能看到示例

Django 项目试炼blog(6) -- 文章详情页1 -- 点赞功能

url #文章详情页 re_path(r'(?P<username>\w+)/article/(?P<article_id>\d+)/$',views.article), # 点赞 path('up_down/', views.up_down), views from django.db.models import F def up_down(request): sign = request.POST.get('sign') sign = json.loads(sign) # 前端

Django 项目试炼blog(9) -- 文本编辑器的使用(文件存储,预览)

HTML <div class="col-md-9"> <div> <p class="text-center" style="background-color: #e5eef7;font-size: 18px" >添加文章</p> <form action="" method="post" style="margin-top: 40px&qu

Django第8章: 多级评论树

模拟实现流程 代码 // 传入的参数形式要求 comment_list = comment_list = [ {'id': 1, 'content': '1111', 'parent_id': None, 'children_contents':[]}, ... ] // 转换成嵌套结果列表 def transform_list(comment_list): comment_dict = {} for d in comment_list: id = d.get('id') comment_dic

jdango 项目试炼blog(3)--基于Form组件ajax用户注册

1.利用form组件建立form组件 from app01.models import UserInfo from django import forms from django.forms import widgets from django.core.exceptions import ValidationError class UserFrom(forms.Form): #固定格式 user = forms.CharField(max_length=32,label='用户名', # 设置

异步任务利器Celery(二)在django项目中使用Celery

Celery 4.0支持django1.8及以上的版本,低于1.8的项目使用Celery 3.1. 一个django项目的组织如下: - proj/ - manage.py - proj/ - __init__.py - settings.py - urls.py 首先建立proj/proj/celery.py文件: from __future__ import absolute_import, unicode_literals import os from celery import Cele

dgango-博客项目之点赞与评论

一.点赞和踩灭 1.事务 事务:要么同时发生,要么同时不发生,文章点赞表增加一条数据的时候,对应的文章的点赞或者踩灭数加1,如果后面的if语句不能执行,则根据事务,点赞表也不会增加数据 from django.db import transaction                                                         #引入transaction事务 with transaction.atomic():     obj = ArticleUpDown