2011-11-26 12 views
1

나는 한 페이지에 four <div>이 있습니다. 각 <div>25 개의 레코드를 표시하고 싶습니다. 나는 지저분한 코드를 작성했다. 그리고 그 작동하지 않습니다. 나 좀 도와 줄래? 감사합니다For 루프 (템플릿 루프)

<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/

+0

출력은 어떻게됩니까? – second

+0

@second http://i.imgur.com/zuc8y.png – Kulbir

+0

코드가 그림보다 더 유용 할 수 있습니다. http://dpaste.com/ – second

답변

1

잘못하고 있습니다. 사용해보기

<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

당신은 아마 출력에 이런 걸 원하는 :

<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> 

fourcolumnswrapper 네 열로 된 div를 표시하려면이 CSS를해야합니다

마지막으로
.fourcolumnswrapper { 
    width:1000px; /* width must be set */ 
} 

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

장고 템플릿 시스템에서이를 달성하기를 쓸 수 있습니다 :

<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> 

최종 결과는 here on JSFiddle입니다.

1

왜 테이블 형식 데이터에 DIV를 사용하고 있습니까? 거기에 완벽하게 좋은 TABLE 요소가 있습니다.

+0

HTML 테이블과 CSS2로 어떻게 쉽게 할 수 있을까? 나는 행을 열로 의미한다 :'1 | 26 | 51 | 76' 아니'1 | 2 | 3 | 4' 등 – Xaerxess