Django为文章点赞模板文件

一模板文件
{% extends "base.html" %}
{% load staticfiles %}
{% block title %}{{ article.title }}{% endblock %}
{% block content %}
<!-- with发起一个赋值操作，它的结尾部分是endwith，total_likes分别为点赞用户总数，total_likes在
这两部分圈定的范围内有效-->
{% with total_likes=article.users_like.count users_like=article.users_like.all %}

<div class="container">
    <div class="col-md-9">
        <header>
            <h1>{{ article.title }}</h1>
            <p>
                <a href="{% url 'article:author_articles' article.author.username %}">
                    {{ article.author.username }}
                </a>
                <!-- pluralize的作用：如果total_likes为0或复数，则显示的是likes，如果total_likes为1，则显示like-->
                <span style="margin-left:20px" class="glyphicon glyphicon-thumbs-up">{{ total_likes }}like{{ total_likes | pluralize }}</span>
            </p>
        </header>

        <link rel="stylesheet" href="{% static 'editor/css/editormd.preview.css' %}"/>
        <div id='editormd-view'>
        <textarea id="append-test" style="display:none;">
{{ article.body }}
        </textarea>
        </div>
        <div>
            <!--点赞功能实现-->
            <p class="text-center">
                <a onclick="like_article({{article.id}}, 'like')" href="#"><span class="glyphicon glyphicon-thumbs-up">like</span></a>
                <a onclick="like_article({{article.id}}, 'unlike')" href="#"><span style="margin-left: 15px;"
                                                                                   class="glyphicon glyphicon-thumbs-down">unlike</span></a>
            </p>
        </div>
        <div>
            <p class="text-center"><strong>点赞本文的读者</strong></p>
            {% for user in article.users_like.all %}
            <p class="text-center">{{ user.username }}</p>
            {% empty %}
            <p class="text-center">还没有人对此文章表态</p>
            {% endfor %}
        </div>
    </div>


</div>
<script src='{% static "js/jquery.js" %}'></script>
<script src='{% static "editor/lib/marked.min.js" %}'></script>
<script src='{% static "editor/lib/prettify.min.js" %}'></script>
<script src='{% static "editor/lib/raphael.min.js" %}'></script>
<script src='{% static "editor/lib/underscore.min.js" %}'></script>
<script src='{% static "editor/lib/sequence-diagram.min.js" %}'></script>
<script src='{% static "editor/lib/flowchart.min.js" %}''></script>
<script src='{% static "editor/lib/jquery.flowchart.min.js" %}'></script>
<script src='{% static "editor/editormd.js" %}'></script>
<script type="text/javascript" src="{% static 'js/layer.js'%}"></script>
<script type="text/javascript">
$(function(){
    editormd.markdownToHTML("editormd-view", {
        htmlDecode      : "style,script,iframe",  // you can filter tags decode
        emoji           : true,
        taskList        : true,
        tex             : true,  // 默认不解析
        flowChart       : true,  // 默认不解析
        sequenceDiagram : true,  // 默认不解析
    });
});
function like_article(id,action){
    $.ajax({
        url: "{% url 'article:like_article' %}",
        type: "POST",
        data: {"id":id, "action":action},
        success: function(e){
            if(e=="1"){
                layer.msg("感谢点赞");
                window.location.reload();
            }else{
                layer.msg("我会继续努力");
                window.location.reload();
            }
        },
    });
}
</script>
{% endwith %}
{% endblock %}
二测试
cakin24给小明点赞一次后
三数据库新增一条记录
Django为文章点赞模板文件

猜你喜欢
