Что касается цикла (шаблон для цикла) - PullRequest
1 голос
/ 26 ноября 2011

У меня есть four <div> на одной странице. Я хочу отображать 25 записи на каждом <div>. Я написал грязный код. и это не работает. Не могли бы вы помочь мне? спасибо

    <div one >  <div two>   <div three> <div four>
1               26          51          76
2               27          52          77
3               28          53          78
-               -           -           -
-               -           -           -
25              50          75          100
</div>        </div>     </div>     </div>

вот код шаблона.

 <div class="fourcolumnswrapper">
      <div class="moviescolumn">
     {% for movie in movies.object_list %}
    <a href="{{ movie.get_absolute_url}}">{{ movie.title }}</a><br/>
    <!-- Display first 25 record in one div -->
    {% if forloop.counter == 25 %}

        </div>
        {% endif %}
    {% if forloop.counter > 25 and forloop.counter <= 50 %}
        <div class="moviescolumn">

        {% if forloop.counter == 50 %}
            </div>
        {% endif %} 
    {% endif %}
    {% if forloop.counter > 50 and forloop.counter < 75 %}
        <div class="moviescolumn">

        {% if forloop.counter == 75 %}
            </div>
        {% endif %} 
    {% endif %}
     {% endfor %}


    </div>

Обновить вывод: http://i.imgur.com/zuc8y.png Вот исходный код generated by view source. http://dpaste.org/dxKi8/

Ответы [ 3 ]

2 голосов
/ 27 ноября 2011

Почему вы используете DIV для табличных данных?Для этого есть очень хороший элемент TABLE.

0 голосов
/ 29 ноября 2011

Вы делаете неправильно. Попробуйте это

<div class="moviescolumn">

    {% for movie in movies.object_list %}
<a href="{{ movie.get_absolute_url}}">{{ movie.title }}</a><br/>
<!-- Display first 25 record in one div -->
{% if forloop.counter == 25 %}
<!-- Paginator-->
<!-- End Paginator -->
</div>
<div class="moviescolumn">
{% endif %}
{% if forloop.counter == 50 %}
</div>
<div class="moviescolumn">
{% endif %}
{% if forloop.counter == 75 and forloop.counter < 100 %}
</div>
{% endif %}
{% endfor %}
0 голосов
/ 27 ноября 2011

Вы, вероятно, хотите что-то вроде этого при выводе:

<div class="fourcolumnswrapper">
  <div class="moviescolumn">
    <a href="movie_link.html">Movie title here 1</a><br />
    <a href="movie_link.html">Movie title here 2</a><br />
    <a href="movie_link.html">Movie title here 3</a><br />
    <a href="movie_link.html">Movie title here 4</a><br />
    <a href="movie_link.html">Movie title here 5</a><br />
  </div>
  <div class="moviescolumn">
    <a href="movie_link.html">Movie title here 6</a><br />
    <a href="movie_link.html">Movie title here 7</a><br />
    <a href="movie_link.html">Movie title here 8</a><br />
    <a href="movie_link.html">Movie title here 9</a><br />
    <a href="movie_link.html">Movie title here 10</a><br />
  </div>
  <div class="moviescolumn">
    <a href="movie_link.html">Movie title here 11</a><br />
    <a href="movie_link.html">Movie title here 12</a><br />
    <a href="movie_link.html">Movie title here 13</a><br />
    <a href="movie_link.html">Movie title here 14</a><br />
    <a href="movie_link.html">Movie title here 15</a><br />
  </div>
  <div class="moviescolumn">
    <a href="movie_link.html">Movie title here 16</a><br />
    <a href="movie_link.html">Movie title here 17</a><br />
    <a href="movie_link.html">Movie title here 18</a><br />
    <a href="movie_link.html">Movie title here 19</a><br />
    <a href="movie_link.html">Movie title here 20</a><br />
  </div>
</div>

Чтобы отобразить div в fourcolumnswrapper в виде четырех столбцов, вам понадобится этот css:

.fourcolumnswrapper {
  width:1000px; /* width must be set */
}

.moviescolumn {
  float:left;
  width: 25%;
}

Наконец, чтобы достичь этогов шаблонной системе Django вы можете написать:

<div class="fourcolumnswrapper">
  <div class="moviescolumn">
    {% for movie in movies.object_list %}
    <a href="{{ movie.get_absolute_url}}">{{ movie.title }}</a><br/>
    {% if forloop.counter|divisibleby:"25" and not forloop.last %}
  </div>
  <div class="moviescolumn">
    {% endif %}
    {% endfor %}
  </div>
</div>

Вы можете увидеть конечный эффект здесь, на JSFiddle .

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...