Symfony 3.4 - Passing variables in my modals? - symfony

Question

I would like to know if it is possible to pass variables in a modal using Symfony?
Before integrating a modal, my line looked like
<span class="glyphicon glyphicon-remove"></span> Supprimer
It is used to delete a line from my database.
I wanted to add a modal sign confirmation request.
Then I added a modal and now I have this:
<span class="glyphicon glyphicon-remove"></span> Supprimer
The modal :
<div class="modal" id="mymodal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>Modal body text goes here.</p>
</div>
<div class="modal-footer">
<a href="#HereIWantMyVariablesForMyControllerPathRendering" type="button" class="btn btn-primary">Save changes</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
Is there a parameter to put in my link calling the modal, to place the variables?
EDIT:
After using macros, by Fabian, here is my code:
Views/macro/macro.html.twig:
{%- macro create_delete_modal(body, deleteLink) -%}
{% filter spaceless %}
<div id="deleteModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Supprimer?</h4>
</div>
<div class="modal-body">
<p>{{ body }}</p>
</div>
<div class="modal-footer">
Supprimer
<button type="button" class="btn btn-default" data-dismiss="modal">Fermer</button>
</div>
</div>
</div>
</div>
{% endfilter %}
{%- endmacro -%}
Controller delete fonction:
/**
* Suppression d'un package | Suppression d'un type d'utilisateur attribué à un package
*
* #Route("/{id}/{type}/delete", name="paquets_delete")
*/
public function deleteAction(Request $request, $id, $type)
{
$em = $this->getDoctrine()->getManager();
$unPaquet = $em->getRepository('PagesBundle:Paquet')->find($id); //Récupération du package
$nbTypes = count($unPaquet->getTypeUser()); //Récupération du nombre de TypeUser auquel est attribué le package
if($nbTypes == 1)
{
$em->remove($unPaquet); // Si un seul destinataire, on supprimme le package.
}
else if($nbTypes > 1)
{
$am = $this->getDoctrine()->getManager();
$leType = $am->getRepository('PagesBundle:TypeUser')->findByTypeUtilisateur($type);
$unPaquet->deleteTypeFromTypesUser($leType[0]); // Si plusieurs destinataires, on supprimme juste le type d'utilisateur passé en paramètre
}
$em->flush(); // Validation
$this->getDoctrine()->getManager()->getRepository('PagesBundle:User')->updateNbDDLAll("dec"); // A la suppression d'un package, on décrémente le nombre de télécharme
$this->addFlash( // Message d'information à l'admin
'info_delete',
'Package supprimée !'
);
return $this->redirectToRoute('paquets_index'); // Actualisation de la page
}
index.html.twig :
{% extends 'base.html.twig' %}
{% import 'macro/macro.html.twig' as macro %}
{% block body %}
<br/>
<span class="glyphicon glyphicon-plus"></span> Ajouter un package
<br/> <br/>
{% for unType in typesUser %}
{% set i=loop.index0 %}
<h1 class="text-primary text-center">{{unType['typeUtilisateur']}} <span class="badge badge-primary badge-pill w3-small">{{ tabInfos[i]|length }}</span></h1>
<br />
<table class="table table-stripped">
<thead>
<tr>
<th>Id</th>
<th>Titre</th>
<th>Package</th>
<th>Notice</th>
<th>Commentaire</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{% for uneInfo in tabInfos[i] %}
<tr>
<td>{{ uneInfo.id }}</td>
<td>{{ uneInfo.titre }}</td>
<td><a href="{{ path('paquet_fileDDL', { 'id': uneInfo.id, 'type': 'package'}) }}"</a>{{ uneInfo.urlPaquet }} </td>
<td><a href="{{ path('paquet_fileDDL', { 'id': uneInfo.id, 'type': 'notice'}) }}"</a>{{ uneInfo.urlNotice }} </td>
<td>{{ uneInfo.commentaire }}</td>
<td>
<span class="glyphicon glyphicon-edit"></span> Modifier
{#<span class="glyphicon glyphicon-remove"></span> Supprimer #}
<button class="btn btn-danger" type="button" data-toggle="modal" data-target="#deleteModal"><span class="glyphicon glyphicon-remove"></span> Supprimer</button>
{{ macro.create_delete_modal('Voulez-vous vraiment supprimer ce package ? ', path('paquets_delete', {'id':uneInfo.id, 'type': unType['typeUtilisateur']})) }}
</td>
</tr>
{% endfor %}
</tbody>
</table>
<br/><br/>
{% endfor %}
{% endblock %}
The most important part of the html.twig:
{% for uneInfo in tabInfos[i] %}
<tr>
<td>{{ uneInfo.id }}</td>
<td>{{ uneInfo.titre }}</td>
<td><a href="{{ path('paquet_fileDDL', { 'id': uneInfo.id, 'type': 'package'}) }}"</a>{{ uneInfo.urlPaquet }} </td>
<td><a href="{{ path('paquet_fileDDL', { 'id': uneInfo.id, 'type': 'notice'}) }}"</a>{{ uneInfo.urlNotice }} </td>
<td>{{ uneInfo.commentaire }}</td>
<td>
<span class="glyphicon glyphicon-edit"></span> Modifier
<button class="btn btn-danger" type="button" data-toggle="modal" data-target="#deleteModal"><span class="glyphicon glyphicon-remove"></span> Supprimer</button>
{{ macro.create_delete_modal('Voulez-vous vraiment supprimer ce package ? ', path('paquets_delete', {'id':uneInfo.id, 'type': unType['typeUtilisateur']})) }}
</td>
</tr>
{% endfor %}
The problem: it removes the first packages, not the ones I want to delete

Answer 1

I would recomment you to use a macro for your modal. This one you can reuse everytime you want. This would look something like this:
{%- macro create_delete_modal(body, deleteLink) -%}
{% filter spaceless %}
<div id="deleteModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Supprimer?</h4>
</div>
<div class="modal-body">
<p>{{ body }}</p>
</div>
<div class="modal-footer">
Supprimer
<button type="button" class="btn btn-default" data-dismiss="modal">close</button>
</div>
</div>
</div>
</div>
{% endfilter %}
{%- endmacro -%}
And to use it:
{% import 'macro/macro.html.twig' as macro %}
{{ macro.create_delete_modal('Are you sure you want to delete this?', path('paquets_delete', { 'id': uneInfo.id, 'type':unType['typeUtilisateur'] }) }}
<button class="btn btn-danger" type="button" data-toggle="modal" data-target="#deleteModal"><span class="glyphicon glyphicon-remove"></span> Supprimer</button>
Edit
The id of the modal (id="#deleteModal") is not unique any more, as you loop over it. Simply add the current loop index to it and it will work as expected.
{%- macro create_delete_modal(id, body, deleteLink) -%}
{% filter spaceless %}
<div id="{{ id }}" class="modal fade" role="dialog">
And in your loop pass the loop index:
{% for uneInfo in tabInfos[i] %}
<tr>
<td>
<button class="btn btn-danger" type="button" data-toggle="modal" data-target="#deleteModal-{{ uneInfo.id }}"><span class="glyphicon glyphicon-remove"></span> Supprimer</button>
{{ macro.create_delete_modal('deleteModal-'~uneInfo.id, 'Voulez-vous vraiment supprimer ce package ? ', path('paquets_delete', {'id':uneInfo.id, 'type': unType['typeUtilisateur']})) }}
</td>
</tr>
{% endfor %}