How to render json into a twig in Symfony2 - php

Question

The question is how to pass a json to twig to render a template. I've tried to pass a json with JsonResponse object but I did not find the way to render the template.
TarifasController.php
<?php
/*
* This file is part of the Symfony package.
*
* (c) Fabien Potencier <fabien#symfony.com>
*
* For the full copyright and license information, please view the LICENSE
* file that was distributed with this source code.
*/
namespace AppBundle\Controller\Admin;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\HttpFoundation\JsonResponse;
use Symfony\Bundle\FrameworkBundle\Controller\Controller;
use Sensio\Bundle\FrameworkExtraBundle\Configuration\Method;
use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
use Sensio\Bundle\FrameworkExtraBundle\Configuration\Security;
use AppBundle\Entity\Tarifa;
/**
*
* #Route("/tarifas")
*/
class TarifasController extends Controller
{
/**
* #Route("/", name="tarifa_index")
*/
public function indexAction()
{
$entityManager = $this->getDoctrine()->getManager();
$tarifas = $entityManager->getRepository('AppBundle:Tarifa')->findAll();
return $this->render('admin/tarifas/index.html.twig', array('tarifas' => $tarifas));
//return new JsonResponse(array('json_tarifas' => json_encode($tarifas)));
}
}
index.html.twig
{% extends 'admin/layout.html.twig' %}
{% block body_id 'admin_post_show' %}
{% block main %}
<h1>{{ 'label.project_list'|trans }}</h1>
<table id="tarifas_index" class="table table-striped">
<thead>
<tr>
<th>{{ 'Id' }}</th>
<th><i class="fa fa-user"></i> {{ 'label.title'|trans }}</th>
<th><i class="fa fa-calendar"></i> {{ 'label.summary'|trans }}</th>
<th><i class="fa fa-calendar"></i> {{ 'label.content'|trans }}</th>
<th><i class="fa fa-cogs"></i> {{ 'label.actions'|trans }}</th>
</tr>
</thead>
<tbody>
{% for tarifa in tarifas %}
<tr>
<td>{{ tarifa.id }}</td>
<td>{{ tarifa.codigo }}</td>
<td>{{ tarifa.nombre }}</td>
<td>{{ tarifa.razon }}</td>
<td>
<div class="item-actions">
<a href="{{ path('project_detail', { id: tarifa.id }) }}" class="btn btn-sm btn-default">
{{ 'action.show'|trans }}
</a>
</div>
</td>
</tr>
{% endfor %}
</tbody>
</table>
<script>
$(document).ready( function () {
$('#tarifas_index').DataTable({
data: tarifas
});
} );
</script>
{% endblock %}
How can I pass a json from the controller to use it in the DataTable (in twig template) but mantaining the render in this controller. Please, can you help me?

Answer 1

You can render like this,
return $this->render('admin/tarifas/index.html.twig', array(
'tarifas' => $tarifas
'json_tarifas' => json_encode($tarifas)
));
and retrieve like this in twig,
<script type="text/javascript">
$(document).ready( function () {
$('#tarifas_index').DataTable({
data: $.parseJSON('{{ json_tarifas | raw }}')
});
} );
</script>

Answer 2

I don't understand what you are trying to achieve but you can simply send json encoded and normal data to your twig, to use it how you want
return $this->render('admin/tarifas/index.html.twig', array(
'tarifas' => $tarifas
'json_tarifas' => json_encode($tarifas)
));