symfony在模态引导程序中加载数据

i need help again, i have my list of products.. and i want to show in a modal bootstrap te details of products... im using symfony 2.8, Yaml, bootstrap and mysql... this is my code

<tbody>
{% for entity in tipoProductos %}
    <tr>
        <td>{{ entity.id }}</td>
        <td>{{ entity.nombre }}</td>
        <td class="hidden-480">{{ entity.abreviacion }}</td>
        <td class="hidden-480">{{ entity.descripcion }}</td>
        <td><span class="label label-sm label-success arrowed arrowed-righ">{{ entity.estado==1?'Habilitado':'Deshabilitado' }}</span></td>
        <td>
            <div class="hidden-sm hidden-xs action-buttons">
                <a class="green" href="#modal-table" role="button" data-toggle="modal"> SHOW </a>
            </div>
            <div id="modal-table" class="modal fade" tabindex="-1">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header no-padding">
                            <div class="table-header">
                                Tipos de Obra
                            </div>
                        </div>
                        <div class="modal-body no-padding">
                            <table class="table table-striped table-bordered table-hover no-margin-bottom no-border-top">
                                <thead>
                                    <tr>
                                        <th>Nombre</th>
                                        <th>Abreviacion</th>
                                        <th>Descripcion</th>
                                    </tr>
                                </thead>

                                <tbody>
                                    <tr>
                                        <td>{{ entity.nombre}}</td>
                                        <td>{{ entity.abreviacion }}</td>
                                        <td>{{ entity.descripcion}}</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div><!-- /.modal-content -->
                </div><!-- /.modal-dialog -->
            </div>
        </td>
    </tr>
{% endfor %}

I have seen some posts that use only php, but they use a little complex functions, somebody that can help me please. I know it can be done with javascript, which is the best and fastest way to do it .. someone to help me please ...

You must put an attribute, and the id of the modal to the link - https://www.w3schools.com/bootstrap/bootstrap_modal.asp