正文

第二十二bbs(代码片段)

ckl893  ckl893  2022-10-22  399

关键词：

对评论内容进行评论

1.1.增加评论按钮

comment_hander.py

def render_tree_node(tree_dic,margin_val):
    html = ""
    #展示子集评论
    for k, v in tree_dic.items():
        #合成评论、日期、用户名及评论按钮
        ele = "<div class=\'comment-node\' style=\'margin-left:%spx\'>" % margin_val + k.comment + "<span style=\'margin-left:20px\'>%s</span>" %k.date \\
              + "<span style=\'margin-left:20px\'>%s</span>" %k.user.name \\
              + \'<span comment-id="%s"\' %k.id +\' style="margin-left:10px" class="glyphicon glyphicon-comment add-comment" aria-hidden="true"></span>\' \\
              + "</div>"
        html += ele
        html += render_tree_node(v,margin_val+10)
    return html

def render_comment_tree(tree_dic):
    #展示父级评论
    html = ""
    for k,v in tree_dic.items():
        ele = "<div class=\'root-comment\'>" + k.comment + "<span style=\'margin-left:20px\'>%s</span>" %k.date \\
              + "<span style=\'margin-left:20px\'>%s</span>" %k.user.name \\
              + \'<span comment-id="%s"\' %k.id + \'style="margin-left:10px" class="glyphicon glyphicon-comment add-comment" aria-hidden="true"></span>\' \\
              + "</div>"
        html += ele
        html += render_tree_node(v,10)
    return html

查看效果：

1.2.点击评论按钮，展示评论框

1.2.1.克隆原来评论框

article_detail.html

 % if request.user.is_authenticated %
                <!-- 判断用户已经登录，输入框输入评论 -->
                <div class="new-comment-box"> <!-- 评论框增加样式 -->
                    <textarea class="form-control" rows="3"></textarea>
                    <!-- 按钮样式 -->
                    <button type="button" style="margin-top: 10px;" class="btn btn-success pull-right">评论</button>
                </div>
            % else %
                <div class="jumbotron">
                 <!-- 点击登录后，跳转到原先准备评论的页面，也就是给原路径加next?xxx -->
                  <h4 class="text-center"><a class="btn-link" href="% url \'login\' %?next= request.path ">登录</a>后评论</h4>
                </div>
            % endif %

<script>
    //评论展示
    function getComments() 
        $.get("% url \'get_comments\' article_obj.id %",function(callback)
            //console.log(callback);
            $(".comment-list").html(callback);

            //start add comment
            $(".add-comment").click(function () 
                var comment_id = $(this).attr("comment-id");
                console.log("comment id" + comment_id);
                //克隆评论框并添加
                var new_comment_box_div = $(".new-comment-box").clone();
                $(".new-comment-box").remove();//删除之前的评论框,不删除会展示所有评论框
                $(this).parent().append(new_comment_box_div);
            )
        );

1.2.2.查看效果

1.3.新加评论内容并加到底部

1.3.1.评论新增

article_detail.html

<script>
    //评论展示
    function getComments() 
        $.get("% url \'get_comments\' article_obj.id %",function(callback)
            //console.log(callback);
            $(".comment-list").html(callback);

            //start add comment
            $(".add-comment").click(function () 
                var comment_id = $(this).attr("comment-id");
                console.log("comment id" + comment_id);
                //克隆评论框并添加
                var new_comment_box_div = $(".new-comment-box").clone(true);
                $(".new-comment-box").remove();//删除之前的评论框,不删除会展示所有评论框
                $(this).parent().append(new_comment_box_div);
            )
        );

       $(".comment-box button").click(function () 
           var comment_text = $(".comment-box textarea").val()
           if (comment_text.trim().length < 5)
               alert("评论字数不能少于5");
           else
               //post
               //添加评论id
               var parent_comment_id = $(this).parent().prev().attr(\'comment-id\');

               $.post("% url \'post_comment\' %",
                   
                       //1为评论
                       \'comment_type\':1,
                       article_id:" article_obj.id ",
                       parent_comment_id:parent_comment_id,
                       //评论内容
                       \'comment\':comment_text.trim(),
                       //获取csrf
                       \'csrfmiddlewaretoken\':getCsrf()
                   ,
                   function(callback)
                       console.log(callback);
                       if (callback == "success")
                           var new_comment_box_div = $(".new-comment-box").clone(true);
                           //在刷新评论之前，把评论框再放回文章底部
                           $(".comment-list").before(new_comment_box_div);
                           $(".new-comment-box textarea").val("");
                           //alert("hahhahahahha")
                           getComments();
                       
               )//end post
           //end if
       );//end button click

1.3.2.新增评论

2.配置发帖

2.1.主页新增发帖选项

base.html

       <ul class="nav navbar-nav navbar-right">
              <!-- 如果用户登录，则显示用户名及注销，否则显示登录 -->
              % if request.user.is_authenticated %
                  <li class=""><a href="#"> request.user.userprofile.name </a></li>
                  <li class=""><a href="% url \'logout\' %">注销</a></li>
              % else %
                  <li class=""><a href="% url \'login\' %">登录/注册</a></li>
              % endif %
              <li class=""><a href="% url \'new-article\' %">发帖</a></li>
          </ul>

2.2.配置url

from django.conf.urls import url,include
from bbs import views
urlpatterns = [
    url(r\'^$\', views.index),
    url(r\'category/(\\d+)/$\', views.category),
    url(r\'detail/(\\d+)/$\', views.article_detail,name="article_detail"),
    url(r\'comment/$\', views.comment,name="post_comment"),
    url(r\'^comment_list/(\\d+)/$\', views.get_comments,name="get_comments"),
    url(r\'^new_article/$\', views.new_article,name="new-article"),
]

2.3.配置方法

2.3.1.配置modelForm

#!/usr/bin/env python
# -*- coding: utf-8 -*-

from django.forms import ModelForm
from bbs import models

class ArticleModelForm(ModelForm):
    class Meta:
        model = models.Article
        exclude = ()

2.3.2.配置views

view.py

from bbs import form

def new_article(request):
    if request.method == \'GET\':
        article_form = form.ArticleModelForm()
        return render(request,\'bbs/new_article.html\',\'article_form\':article_form)

2.4.配置静态返回页面

% extends \'base.html\' %
% load custom %
% block page-container %
    <div class="wrap-left">
        <form>
             article_form 
        </form>
    </div>
    <div class="wrap-right">
        right
    </div>
    <div class="clear-both"></div>
% endblock %

2.5.查看结果

2.6.配置编辑页面

2.6.1.下载文件

https://docs.ckeditor.com/ckeditor4/latest/guide/dev_installation.html#download

2.6.2.配置引用

添加文件目录

配置文件引用

% extends \'base.html\' %
% load custom %
% block page-container %
    <div class="wrap-left">
        <form>
            <textarea name="ckl" id="article-fatie"></textarea>
             article_form 
        </form>
    </div>
    <div class="wrap-right">
        right
    </div>
    <div class="clear-both"></div>
% endblock %
% block bottom-js %
    <script src="/static/plugins/ckeditor/ckeditor.js"></script>
    <script>
            CKEDITOR.replace(\'article-fatie\');
    </script>
% endblock %

查看效果：

2.7.美化form表单

2.7.1.配置列表排列方式

拷贝之前的代码 form.py

#!/usr/bin/env python
# -*- coding: utf-8 -*-

from django.forms import ModelForm
from bbs import models

class ArticleModelForm(ModelForm):
    class Meta:
        model = models.Article
        exclude = ()

    def __init__(self, *args, **kwargs):
        super(ArticleModelForm, self).__init__(*args, **kwargs)
        # self.fields[\'qq\'].widget.attrs["class"] = "form-control"

        for filed_name in self.base_fields:
            filed = self.base_fields[filed_name]
            filed.widget.attrs.update(\'class\': \'form-control\')

查看效果：

2.7.2.过滤掉不需要的选项

form.py

#!/usr/bin/env python
# -*- coding: utf-8 -*-

from django.forms import ModelForm
from bbs import models

class ArticleModelForm(ModelForm):
    class Meta:
        model = models.Article
        exclude = (\'author\',\'pub_date\',\'priority\')

    def __init__(self, *args, **kwargs):
        super(ArticleModelForm, self).__init__(*args, **kwargs)
        # self.fields[\'qq\'].widget.attrs["class"] = "form-control"

        for filed_name in self.base_fields:
            filed = self.base_fields[filed_name]
            filed.widget.attrs.update(\'class\': \'form-control\')

2.7.3.引用替换原有的textarea

% extends \'base.html\' %
% load custom %
% block page-container %
    <div class="wrap-left">
        <form>
             article_form 
        </form>
    </div>
    <div class="wrap-right">
        right
    </div>
    <div class="clear-both"></div>
% endblock %
% block bottom-js %
    <script src="/static/plugins/ckeditor/ckeditor.js"></script>
    <script>
            CKEDITOR.replace(\'id_content\');
    </script>
% endblock %

查看效果：

2.8.发布文章

2.8.1.配置views.py

def new_article(request):
    if request.method == \'GET\':
        article_form = form.ArticleModelForm()
        return render(request,\'bbs/new_article.html\',\'article_form\':article_form)
    elif request.method == \'POST\':
        print(request.POST)
        article_form = form.ArticleModelForm(request.POST)
        if article_form.is_valid():
            article_form.save()
        return HttpResponse(\'new article has been published!\')

2.8.2.配置发布按钮

new_article.html

....
        <form>
             article_form 
            <input type="submit" class="btn btn-success pull-right" value="发布"/>
        </form>
....

2.8.3.发布文章测试

2.8.4.报错

2.8.5.新增CSRF

new_article.html

    <div class="wrap-left">
        <form method="post">% csrf_token %
             article_form 
            <input type="submit" class="btn btn-success pull-right" value="发布"/>
        </form>
    </div>

提交报错：

2.8.6.增加post方法

def new_article(request):
    if request.method == \'GET\':
        print("this is get")
        print(request.method)
        article_form = form.ArticleModelForm()
        return render(request,\'bbs/new_article.html\',\'article_form\':article_form)
    elif request.method == \'POST\':
        print(request.POST)
        article_form = form.ArticleModelForm(request.POST)
        if article_form.is_valid():
            article_form.save()
            return HttpResponse(\'new article has been published!\')
        else:
            return render(request,\'bbs/new_article.html\',\'article_form\':article_form)

再次提交:

2.8.7.文件已经选择，仍然报错

django 上传文件需要加字段

def new_article(request):
    if request.method == \'GET\':
        print("this is get")
        print(request.method)
        article_form = form.ArticleModelForm()
        return render(request,\'bbs/new_article.html\',\'article_form\':article_form)
    elif request.method == \'POST\':
        print(request.POST)
        article_form = form.ArticleModelForm(request.POST,request.FILES)
        if article_form.is_valid():
            article_form.save()
            return HttpResponse(\'new article has been published!\')
        else:
            return render(request,\'bbs/new_article.html\',\'article_form\':article_form)

再次提交：

仍然提示，未选择任何文件，解决如下：

修改new_article.html

    <div class="wrap-left">
        <form method="post" enctype="multipart/form-data">% csrf_token %
             article_form 
            <input type="submit" class="btn btn-success pull-right" value="发布"/>
        </form>

再次提交：

作者id不能为空

2.8.8.处理作者id

修改方法，插入作者id数据：

def new_article(request):
    if request.method == \'GET\':
        print("this is get")
        print(request.method)
        article_form = form.ArticleModelForm()
        return render(request,\'bbs/new_article.html\',\'article_form\':article_form)
    elif request.method == \'POST\':
        print(request.POST)
        article_form = form.ArticleModelForm(request.POST,request.FILES)
        if article_form.is_valid():
            #获取数据
            data = article_form.cleaned_data
            data[\'author_id\'] = request.user.userprofile.id
            article_obj = models.Article(**data)
            article_obj.save()
            #article_form.save()
            return HttpResponse(\'new article has been published!\')
        else:
            return render(request,\'bbs/new_article.html\',\'article_form\':article_form)

提交内容：

发布成功：

查看页面：

页面却是html元素格式：

修改如下：

article_detail.html

        <div class="article-content">
            <img class="article-detail-head-img" src="/static/ article_obj.head_img|truncate_url ">
            <!-- 文章内容　-->
             article_obj.content|safe 
        </div>

再次查看

页面排序，按最新发布排序，修改index.html

第二十二课单链表的具体实现(代码片段)

本节目标：添加LinkList.h文件：1#ifndefLINKLIST_H2#defineLINKLIST_H34#include"List.h"5#include"Exception.h"67namespaceDTLib8910template<typenameT>11classLinkList:publicList<T>1213protected:14struct 查看详情

easyclickhtmlui第二十二节jquery事件代理(代码片段)

EasyClickHtmlUI第二十二节jQuery事件代理事件代理介绍事件代理就是利用事件冒泡的原理(事件冒泡就是事件会向它的父级一级一级传递),把事件加到父级上，通过判断事件来源，执行相应的子元素的操作，事件代理首先可... 查看详情

《pyinstaller打包实战指南》第二十二节单文件模式打包playwright(代码片段)

第二十二节单文件模式打包Playwright打包时解决掉的问题：ImportError:DLLloadfailedwhileimporting_greenlet:动态链接库(DLL)初始化例程失败。Executabledoesn\'texistat C:\\Users\\user\\Desktop\\la_vie\\dist\\belle\\playwright\\driver\\pac 查看详情

第二十二课打造专业的编译环境（下）(代码片段)

顶层目录如下：顶层makefile：1includepro-cfg.mk2includecmd-cfg.mk3includepro-rule.mk cmd-cfg.mk：1AR:=ar2ARFLAGS:=crs34CC:=gcc5LFLAGS:=6CFLAG 查看详情

golang✔️走进go语言✔️第二十二课json&文件读写(代码片段)

【Golang】✔️走进Go语言✔️第二十二课json&文件读写概述json编码解码文件读写文件读取写入文件概述Golang是一个跨平台的新生编程语言.今天小白就带大家一起携手走进Golang的世界.(第22课)jsonjson(JavaScriptObjectNotation)是一种轻... 查看详情

golang✔️走进go语言✔️第二十二课json&文件读写(代码片段)

平时二十二测(代码片段)

第一题水题未放，今天第二题又读入超时2000*2000的读入要快读啊，上次没长教训第二题：图论题.二维前缀和的应用. 最重要的：这就是一棵树啊标算为:对于不包含环的图,连通块数目=点数-边数,所以利用二维前缀和进行... 查看详情

c++从青铜到王者第二十二篇:c++11(代码片段)

系列文章目录文章目录系列文章目录前言一、C++11简介(了解)二、列表初始化(了解)1.C++98中的初始化问题2.内置类型的列表初始化3.自定义类型的列表初始化三、变量类型推导(了解)1.为什么需要类型推导2.decltype类型推... 查看详情

第二十二节，tensorflow中rnn实现一些其它知识补充(代码片段)

一初始化RNN上一节中介绍了通过cell类构建RNN的函数，其中有一个参数initial_state，即cell初始状态参数，TensorFlow中封装了对其初始化的方法。1.初始化为0对于正向或反向，第一个cell传入时没有之前的序列输出值，所以需要对... 查看详情

第二十二篇商城系统-skywalking链路追踪商城系统完结篇(代码片段)

Skywalkingskywalking是一个apm系统，包含监控，追踪，并拥有故障诊断能力的分布式系统一、Skywalking介绍1.什么是SkyWalking Skywalking是由国内开源爱好者吴晟开源并提交到Apache孵化器的产品，它同时吸收了Zipkin/Pinpoint... 查看详情

第二十二篇商城系统-skywalking链路追踪商城系统完结篇(代码片段)

第二十二节，tensorflow中的图片分类模型库slim的使用(代码片段)

Google在TensorFlow1.0，之后推出了一个叫slim的库，TF-slim是TensorFlow的一个新的轻量级的高级API接口。这个模块是在16年新推出的，其主要目的是来做所谓的“代码瘦身”。它类似我们在TensorFlow模块中所介绍的tf.contrib.lyers模块，将很... 查看详情

《剑指offer》第二十二题：链表中倒数第k个结点(代码片段)

//面试题22：链表中倒数第k个结点//题目：输入一个链表，输出该链表中倒数第k个结点。为了符合大多数人的习惯，//本题从1开始计数，即链表的尾结点是倒数第1个结点。例如一个链表有6个结点，//从头结点开始它们的值依次是... 查看详情

linux从青铜到王者第二十二篇:linux高级io(代码片段)

系列文章目录文章目录系列文章目录前言一、五种IO模型1.阻塞IO2.非阻塞IO3.信号驱动IO4.异步IO5.IO多路转接二、高级IO重要概念1.同步通信vs异步通信2.阻塞vs非阻塞三、I/O多路转接之select1.select函数的作用2.select函数的原型3.fd_set结... 查看详情

日常exception第二十二回：构造函数异常cannotconstructinstanceof`xx.xxx`(nocreators,likedefaultconstruct(代码片段)

热门系列：程序人生，精彩抢先看1.问题近期忙于开发，自测时发现了如题的一个异常。主要报错信息先贴一下：withrootcausecom.fasterxml.jackson.databind.exc.InvalidDefinitionException:Cannotconstructinstanceof`xx.xxx.xxxxx.ba 查看详情

《剑指offer》第二十二题（链表中倒数第k个结点）(代码片段)

《pyinstaller打包实战指南》第二十二节单文件模式打包playwright(代码片段)

第二十二节jquery事件(代码片段)

1<!--事件函数列表：2blur()元素失去焦点3focus()元素获得焦点4click()鼠标单击5mouseover()鼠标进去（进入子元素也触发）6mouseout()鼠标离开（离开子元素也触发）7mouseenter()鼠标进入（进入子元素不触发）8mouseleave()鼠标离开（离开子... 查看详情