根据使用django templatin的扩展页面,以不同方式显示html div块

时间:2017-03-16 10:41:30

标签: html django

我正在使用django的扩展模板功能构建网页。因此,我有一个base.html,我有搜索字段,我希望根据扩展base.html的网页显示不同的搜索字段。以下是我想要显示的字段: enter image description here

相应的代码是:

<div class="row">
         <div class="container-fluid col-md-offset-9 col-md-3">
          <a href="../posts/newpost/" class="btn btn-info" role="button">
               <span class="glyphicon glyphicon-education" aria-hidden="true"></span> Buton
       </a>
       </div>
      </div>

      <div class="container-fluid">
    <h1 id="Titre" align="center">Title </h1><br>
   </div>

   <div class="col-md-12" style="height:100px;"></div>

<form class="form-inline text-center" action="{% url 'posts:postsearch' %}"  id="form-searchLessons">
  <div class="form-group">
    <input type="text" class="form-control input-lg" id="typeCours" list="matieres" placeholder="Keyword" name="discipline" autocomplete="off">
  </div>
  <div class="form-group">
    <input type="text" class="form-control input-lg" id="Localisation" placeholder="Lieu."
          name="localisation" onFocus="geolocate()">
  </div>
  <button type="submit" class="btn btn-default btn-lg" id="btn-getLessons">
    <span class="glyphicon glyphicon-search" aria-hidden="true"></span> Trouver !
  </button>
</form>
</div>

如果是page1,我希望字段显示为上图。 然后,如果我从第2页扩展base.html,这应该是这样的:

enter image description here

目前我正在撰写完整的不同页面:

<div class="container-fluid">
   <div class="row reduced_search-bar">
      <div class="col-lg-9">

         <form class="form-inline">
           <div class="form-group">
             <input type="text" class="form-control" id="typeCours" placeholder="Keyword">
           </div>
           <div class="form-group">
             <input type="text" class="form-control" id="Localisation" placeholder="Lieu">
           </div>
           <button type="submit" class="btn btn-default">
             <span class="glyphicon glyphicon-search" aria-hidden="true"></span> Trouver !
           </button>
         </form>
      </div>
      <div class="col-lg-3">
              <a href="{%  url 'posts:add' %}" class="btn btn-info" role="button">
                  <span class="glyphicon glyphicon-education" aria-hidden="true"></span> Buton ?
              </a>
       </div>
   </div>
 </div>

我想要的是将所有这些代码放在一个base.html中。根据我是否从page1或page2延伸,我的打印方式不同。

1 个答案:

答案 0 :(得分:0)

如果我理解正确,您可以从视图中传递额外的上下文,以确定要显示的代码:

# views.py
from django.shortcuts import render

def page1(request):
    return render(request, 'page1.html')

def page2(request):
    return render(request, 'page2.html', {'page2': True})

# base.html
{% if page2 %}
    # Necessary code for page 2
{% else %}
    # Necessary code for other pages
{% endif %}

# page1.html
{% extends 'base.html' %}

# page2.html
{% extends 'base.html' %}