how can i divide items by categoria with twig - php

Question

im trying to divide my items by category with javascript and twig, so after bringing all the products from the database i dont know how can i separate products with {% for %}. this is my twig code:
<div class="col-sm-4" itemscope itemtype="http://schema.org/Product">
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title truncate">Categoria:{{ producto.idCategoria }}</h5>
</div>
<div class="panel-body">
Nombre:{{ producto.producto }}
<img src="{{ asset('bundles/savainventario/images/'~producto.filePersistencePath ) }}"
alt="404 file not found" class="img-thumbnail"/>
</div>
<div class="panel-footer">
<div class="container-fluid">
{#Precio#}
<span itemprop="price">
Precio:{{ producto.precio }}.Bsf
</span>
{#Form#}
<form class="form-inline" role="form" method="get"
action={{ path('sava_inventario_addcart', {'id': producto.idProducto }) }}>
<div class="form-group">
<input class="btn btn-default" type="submit" value="Agregar">
</div>
{#Ver mas#}
<!-- Button trigger modal -->
</form>
<button class="btn btn-primary btn-sm" data-toggle="modal"
data-target="#myModal{{ producto.idProducto }}">
Ver mas...
</button>
<!-- Modal -->
<div class="modal fade" id="myModal{{ producto.idProducto }}" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span
aria-hidden="true">×</span><span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="myModalLabel">{{ producto.producto }}</h4>
</div>
<div class="modal-body">
<!-- Datos productos -->
<table class="table table-striped">
<tr>
<td>Nombre:</td>
<td>{{ producto.producto }}</td>
</tr>
<tr>
<td>Image:</td>
<td>
<img src="{{ asset('bundles/savainventario/images/'~producto.filePersistencePath ) }}"
alt="404 file not found"/></td>
</tr>
<tr>
<td>Descripcion</td>
<td>{{ producto.descripcionProducto }}</td>
</tr>
<tr>
<td>Precio:</td>
<td>{{ producto.precio }}</td>
</tr>
<tr>
<td>Cantidad:</td>
<td>{{ producto.cantidad }}</td>
</tr>
<tr>
<td>Categoria:</td>
<td>{{ producto.idCategoria.categoria }}</td>
</tr>
<tr>
<td>Modelo:</td>
<td>{{ producto.idModelo.modelo }}</td>
</tr>
<tr>
<td>Video:</td>
<td>
<iframe width="433" height="315"
src="//www.youtube.com/embed/tQShyqnRx3s?list=PLw4rBoBPv1Vbq16M4SFkJPZj08FMaaR-8"
frameborder="0" allowfullscreen></iframe>
</td>
</tr>
</table>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
</div> {#footer end#}
</div>
</div>
{% endif %}
{% endfor %}
</div>
</div>
my question is how can i separate my items by category, in one category i print it in one div container, in another div container i add products from another category and so on.

Answer 1

If your entites are setup properly this shouldnt be hard:
//Contoller
/**
* #Template()
*/
public function showProductsByCategory()
{
$categories = $this->getDoctrine()->getManager()
->getRepository("NamespacedBundle:Category")->findAll();
return array(
'categories' => $categories
);
}
Assuming your categories know about products
//Category Entity
/**
* #ORM\OneToMany(targetEntity="Product", mappedBy="category")
*/
protected $products;
And your products are tied to the category
//Product Entity
/**
* #ORM\ManyToOne(targetEntity="Category", inversedBy="products")
* #ORM\JoinColumn(name="category", referencedColumnName="category_id")
*/
protected $category;
Then your twig could be something based on:
//Sample Twig
{% for category in categories %}
<div class="container">
<h1>{{category.name}}</h1>
<ul>
{% for product in category.products %}
<li>{{product.name}}</li>
{% endfor %}
</div>
{% endfor %}