Django basic template

Life is not all roses
Life is not a good road

The template in Django is the front-end display, or the HTML page. I don’t have much to introduce about the html, js, and css parts, because it is mainly the front-end stuff. This article mainly introduces the mutual value of the template and the view, as well as the inheritance of the template.

Create a template

By default, we use render to render the index.html page in the view function.

1
2
def home(request):
return render(request, 'index.html')

Then create a new template file in the application directory, and create a new index.html file.

Template to pass the view to the view

This part is relatively simple, such as using form form, passing some parameters to a specific url, of course, you need to set the urls.py route, otherwise the template request can not be accurately conveyed to the specific processing function of the view.
stencil:

1
2
3
4
<form action="/add/" method="get">
<input type="text" name="content">
<input type="submit">
</form>

view:

1
2
3
4
def add(request):
content=request.GET.get("content")
return HttpResponse(content)

urls.py:

1
2
3
4
5
from django.conf.urls import url
From webapp import views #import the app's views file
urlpatterns = [
url(r'^add/', views.add),

The template passes the default value parameters to the view:

1
2
3
4
<form action="/update/" method="GET">
<input type="hidden" name="nid" value="{{ i.nid }}">
<input type="submit" value="Get details" />
</form>

Description: The update method passed to the view by the template. The parameter is nid and the value is i.nid.

View to template pass

Change the above view code to:

1
2
3
def add(request):
content="123"
return render(request,"index.html",{"content":content})

Template code:

1
<p>content is {{content}}</p>

Description: In addition to strings, you can also pass data structures such as dictionaries and lists.

List

The value of the dictionary in python is list[0], which is used in the template.

1
{{ list.0 }}

Dictionary

The value of the dictionary in python is dict[“key”], which is used in the template.

1
{{ dict.key }}

FOR loop

Traverse the list:

1
2
3
{% for i in content %}
{{ i }}
{% endfor %}

Traverse the list and add the value after the output,

1
2
3
{% for i in content %}
{{ i }},
{% endfor %}

Traversing the dictionary:

1
2
3
{% for key, value in info_dict.items %}
{{ key }}: {{ value }}
{% endfor %}

Multi-layer loop

1
2
3
4
5
{% for i in content %}
{% for j in i.pan %}
{{ j }}
{% endfor %}
{% endfor %}

The parameters of the loop:

1
2
3
4
5
6
7
Forloop.counter index starts from 1
Forloop.counter0 index counts from 0
Forloop.revcounter index from maximum length to 1
Forloop.revcounter0 index from maximum length to 0
Forloop.first is true when the traversed element is the first item
Forloop.last true when the traversed element is the last item
Forloop.parentloop is used in a nested for loop to get the for loop of the previous for loop

Determine if the list is empty:

1
2
3
4
5
{% for i in list %}
<li> {{i.name}} </ li>
{% empty %}
<li>Sorry, the list is empty</li>
{% endfor %}

Logic judgment

== != >= <= < >
1
2
3
4
5
6
7
8
9
10
11
{% if var> = 90%}
case 1
{% elif var> = 80%}
case 2
{% elif var> = 70%}
case 3
{% elif var> = 60%}
case 4
{% else %}
case 5
{% endif %}
and not or in not in
1
2
3
4
5
{% if num <= 100 and num >= 0 %}
case 1
{% else %}
case 2
{% endif %}

Determine if the element is in the list:

1
2
3
{% if 'nmask' in List %}
case 1
{% endif %}

Built-in variables
1
2
3
{{ request.user }} current user
{{ request.path }} current URL
{{ request.GET.urlencode }} current get parameter

Template inheritance

Generally, developing web pages requires writing some template pages, such as navigation bar, bottom copyright, side navigation, etc., or some function code. The iframe framework may have been used before, but it has now been eliminated. In order to avoid repeated code writing, and for the convenience of later modification, you can use the template inheritance method. The so-called template inheritance is to write a common template first, and then mark some variables. After the other pages are inherited, the mark can be modified by itself. If the template is not modified, the content of the template page is used.
base.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html lang = "and">
<head>
<link rel="stylesheet" href="style.css" />
<title>{% block title %}My amazing site{% endblock %}</title>
</head>
<body>
<div id="sidebar">
{% block sidebar %}
<Ul>
<li><a href="/">Home</a></li>
<li><a href="/blog/">Blog</a></li>
</ Ul>
{% endblock %}
</div>
<div id="content">
{% block content %}{% endblock %}
</div>
</body>
</html>

Note: You can define as many block blocks as possible so that you can customize more places and use them more flexibly.

index.html

1
2
3
4
5
6
7
8
9
{% extends "base.html" %}
{% block title %}My amazing blog{% endblock %}
{% block content %}
{% for entry in blog_entries %}
<h2>{{ entry.title }}</h2>
<p>{{ entry.body }}</p>
{% endfor %}
{% endblock %}

Multi-model inheritance

Environment: There is a root template first, then create a sub-template to inherit the root template, and then other pages inherit the sub-template.
Base.html (parent template page)

1
2
3
4
5
6
7
8
9
10
<!DOCTYPE html>
<html>
<head>
{% block head %}{% endblock %}
<title>{% block title %}{% endblock %}</title>
</head>
<body>
{% block body %}{% endblock %}
</body>
</html>

Base_ch.html (sub-template page)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
{% extends "base.html" %}
{% block body %}
{% block js %}
<script type="text/javascript">
var a = 1;
</script>
{% endblock %}
{% block label %}
<label>This is a base_ch module test!</label>
{% endblock %}
{% endblock %}

Index.html (general inheritance page)

1
2
3
4
5
6
{% extends "base_ch.html" %}
{% block js %}{% endblock %}
{% block label %}
<label>This is a index page test!</label>
{% endblock %}

Reference article

http://code.ziqiangxuetang.com/django/django-template2.html

本文标题:Django basic template

文章作者:nmask

发布时间:2017年09月15日 - 16:09

最后更新:2019年07月11日 - 15:07

原始链接:https://thief.one/2017/09/15/2/en/

许可协议: 署名-非商业性使用-禁止演绎 4.0 国际 转载请保留原文链接及作者。

nmask wechat
欢迎您扫一扫上面的微信公众号,订阅我的博客!
坚持原创技术分享,您的支持将鼓励我继续创作!

热门文章推荐: