【问题标题】:Django - Cant align html tabs properlyDjango - 无法正确对齐 html 选项卡
【发布时间】:2016-11-29 13:29:21
【问题描述】:

我正在尝试显示基于选项卡的数据列表。到目前为止,我能够获取数据并显示它。问题是html部分。 html 的某些部分不应重复,但它们必须至少重复一次...

[![<body class="bootstrap"  >


      <!--#INCLUDE VIRTUAL="TopNavInclude.asp" -->


      <div class="container">

        <div class="col-md-12"> 

          <div class="panel panel-default panel-fade">

            <div class="panel-heading">

              <span class="panel-title">

                <div class="pull-left">

                <ul class="nav nav-tabs">
       {% block content %}

         {% for s in data_seasons %}
                   {% if s == 1 %}
                  <li class="active"><a href="#tab{{s}}" data-toggle="tab" ><i class="glyphicon glyphicon-send"></i> Temporada {{s}}</a></li>
                  {% else %} 
                  <li><a href="#tab{{s}}" data-toggle="tab" ><i class="glyphicon glyphicon-send"></i> Temporada {{s}}</a></li>

                        {% endif %} 

                       {% endfor %} 

                </ul>

                </div>

                <div class="btn-group pull-right">
                  <div class="btn-group">
                    <a href="#" class="btn  dropdown-toggle" data-toggle="dropdown">
                      <span class="glyphicon glyphicon-cog"></span>
                    </a>
                    <ul class="dropdown-menu" role="menu">
                      <li><a href="#">Action 1</a></li>
                      <li><a href="#">Action 2</a></li>
                      <li class="divider"></li>
                      <li><a href="#">Another Action</a></li>
                    </ul>
                  </div>
                </div>

                <div class="clearfix"></div>

              </span>

            </div>

            <div class="panel-body">

              <div class="tab-content">



     {% for s in data_seasons %}
 {% for ep in data_ep %}


                  {% if s == ep.tve_season %}  

                       {% if s == 1 %}
                   <div class="tab-pane fade in active" id="tab{{s}}"> 

             <h3>Episodios</h3> 
                 <FORM ACTION="" METHOD="post">
                  <INPUT TYPE="hidden" NAME="FormName" VALUE="PrintLetters">
                  <TABLE class="table table-striped">
                  <THEAD> 

                    <TR><TH>Selecionar</TH><TH style="text-align:left">Nome do Episodio</TH><TH style="text-align:left">Duracao</TH><TH>Data/Horario</TH><TH>Sumario</TH></TR>

                  </THEAD>
                  <TBODY>

                    <TR><TD><INPUT TYPE="checkbox" NAME="EventCode" VALUE=588031></TD><TD>{{ep.tve_name}}</TD><TD>{{ep.tve_runtime}}</TD><TD>{{ep.tve_schedule}}</TD><TD>...</TD></TR>

                  </TBODY>
                  </TABLE>

                </FORM>
                </div>


                                 </div>
                        {% else %} 
                        <div class="tab-pane fade" id="tab{{s}}">sss  </div>
                                      {% endif %} 
                        {% endif %}
{% endfor %}
   {% endfor %}
                </div>


                </div>

              </div>

            </div>

          </div>

        </div>

      </div>




      <footer>
      {% endblock %}][1]][1]

原始模板: http://bootsnipp.com/snippets/OMX7O

这个 div 部分应该只运行一次,它应该只用于变量:{{s}} 和 {{ep...}}

{% if s == ep.tve_season %}  

                       {% if s == 1 %}
             <!--This      <div class="tab-pane fade in active" id="tab{{s}}"> 

             <h3>Episodios</h3> 
                 <FORM ACTION="" METHOD="post">
                  <INPUT TYPE="hidden" NAME="FormName" VALUE="PrintLetters">
                  <TABLE class="table table-striped">
                  <THEAD> 

                    <TR><TH>Selecionar</TH><TH style="text-align:left">Nome do Episodio</TH><TH style="text-align:left">Duracao</TH><TH>Data/Horario</TH><TH>Sumario</TH></TR>

                  </THEAD>
                  <TBODY>

                    <TR><TD><INPUT TYPE="checkbox" NAME="EventCode" VALUE=588031></TD><TD>{{ep.tve_name}}</TD><TD>{{ep.tve_runtime}}</TD><TD>{{ep.tve_schedule}}</TD><TD>...</TD></TR>

                  </TBODY>
                  </TABLE>

                </FORM>
                </div> Until this-->


                                 </div>

【问题讨论】:

    标签: html django twitter-bootstrap-3 django-templates


    【解决方案1】:

    查看 for 循环中可用的变量。有一个称为 forloop.first 的方法可能比检查 s = 1 更好。 文档 https://docs.djangoproject.com/en/1.10/ref/templates/builtins/#for

    在以下位置有类似的讨论: Django {% if forloop.first %} question

    你能展示你想要的输出是什么样的吗?

    【讨论】:

    猜你喜欢
    • 2014-06-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多