python - 尝试扩展基本 html 但无法正常工作
问题描述
当按下导航栏上的按钮时,我有一个表单试图访问。我有一个基本模板文件,其中包含导航栏和背景颜色的代码,我还有另一个包含表单代码的模板。每次我删除导航栏按钮似乎都可以工作,{% extends 'base.html' %}
但只显示表单。我希望能够扩展基本模板,以便导航栏背景颜色和导航栏也显示出来,但这不起作用。
来自 base.html 的代码片段
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="/">TweetyBird</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarText">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="/search">Search by Tweet <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Twitter Bot</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">To be added</a>
</li>
</ul>
</div>
</nav>
搜索.html
% extends 'base.html' %}
{%load static%}
<body>
<container >
<form action="/searchoutput/" method="post">
{% csrf_token %}
Input Text:
<input type="text" name="param" required> <br><br>
{{data_external}}<br><br>
{{data}}
<br><br>
<input type="submit" value="Check tweet">
</form>
</container>
</body>
来自 url.py 的片段
path('', views.noreq), #shows the html template for the website
path('search/',views.search),
path('searchoutput/',views.searchoutput),
来自views.py的片段
def noreq(request):
#when no request is made the html is rendered
return render(request,'base.html')
################The method above is required############################################
def search(request):
return render(request,'search.html')
解决方案
这里有几个问题。一方面,我注意到您% extends 'base.html' %}
在 search.html 中没有左括号,但我不确定这是否只是此处的粘贴错误。
其次,您没有内容块。您需要指定扩展模板的内容在 base.html 中的位置。例如:
示例 base.html:
<html>
<head>
<title>My Site</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="/">TweetyBird</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarText">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="/search">Search by Tweet <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Twitter Bot</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">To be added</a>
</li>
</ul>
</div>
</nav>
{% block content %}
{% endblock %}
</body>
</html>
在扩展 base.html 的模板中:
{% extends 'base.html' %}
{%load static%}
{% block content %}
<container >
<form action="/searchoutput/" method="post">
{% csrf_token %}
Input Text:
<input type="text" name="param" required> <br><br>
{{data_external}}<br><br>
{{data}}
<br><br>
<input type="submit" value="Check tweet">
</form>
</container>
{% endblock %}
更多文档:https ://docs.djangoproject.com/en/3.0/ref/templates/language/