How to handle twig view and bootstrap 3 rows/columns?

symfony, twig, twitter-bootstrap-3

Solution

UPDATED:

As @Maerlyn suggested:

{% for row in articles|batch(2) %}
    <div class="row">
        {% for article in row %}
            <div class="col-md-6">
                // your content
            </div>
        {% endfor %}
    </div>
{% endfor %}

OLD way:

Use `loop.index` (doc: The loop variable), modulo (doc: Math operators) and `if` (doc: `if` statement )

{% for article in articles %}
    {% if loop.index % 2 == 1 %}
        <div class="row">
    {% endif %}
    <div class="col-md-6">
        // your content
    </div>
    {% if (loop.index % 2 == 0 or loop.last) %}
        </div>
    {% endif %}
{% endfor %}

Problem

I have an Article entity and I made a findAll() in the controller. I rendered each article in a div with the col-md-6 class. But foreach 2 articles I must wrap these divs in a row div. How can I do this with twig ? Thanks. EDIT : I tried your code (NHG) like this: ``` {% for article in articles %} {% if loop.index % 2 == 0 %} <div class="row"></div> {% endif %} <div class="col-md-6"> <article class="well well-sm"> <a href="#"><img src="{{ article.image }}" alt="{{ article.title }}" class="img-thumbnail"></a> <h2 class="h3 text-center"><a href="#">{{ article.title }}</a></h2> <div class="alert alert-success well-sm"> {{ article.content|striptags|slice(0, 235) }}... </div> <a class="btn btn-default btn-sm pull-right" href="#">{{ article.comments|length }} Comments</a> <div class="btn-group btn-group-sm"> {% for tag in article.tags %} <a class="btn btn-default">{{ tag.name }}</a> {% endfor %} </div> </article> </div> {% endfor %} ``` But it doesn't work. I want to have something like this : ``` <div class="row"> <div class="col-md-6"></div> <div class="col-md-6"></div> </div> <div class="row"> <div class="col-md-6"></div> <div class="col-md-6"></div> </div> <div class="row"> <div class="col-md-6"></div> <div class="col-md-6"></div> </div> ```

Original source