modalité uploder des ficher avec VichUploaderBundle

This commit is contained in:
maher
2026-01-11 16:33:43 +01:00
parent 1d2b4fbb6b
commit 756cae51d2
16 changed files with 849 additions and 5 deletions

View File

@@ -42,7 +42,7 @@
<div class="az-content-label mg-b-5"></div>
<p class="mg-b-20">Créer une nouvelle enquête</p>
{{ form_start(form) }}
{{ form_start(form, {'attr': {'enctype': 'multipart/form-data'}}) }}
<div class="tab-vertical mb-3" id="investigation-information">
<ul class="nav nav-tabs" id="myTab3" role="tablist">
<li class="nav-item">
@@ -162,6 +162,7 @@
</div>
</div>
{# modalities #}
<h4 class="card-title mt-4">Modalité</h4>
<div class="row mt-3">
<div class="col-md-6">
@@ -242,9 +243,38 @@
</div>
{% endfor %}
</div>
<div class="card-body">
<div class="attachments-container" data-prototype="{{ form_widget(formQuestion.attachments.vars.prototype)|e('html_attr') }}" data-index="{{ formQuestion.attachments|length }}" >
{% for attachment in formQuestion.attachments %}
<div class="attachment-item" id="attachment-{{ loop.index0 }}">
{{ form_row(attachment.file, { 'row_attr': {'class': 'mb-0'} }) }}
<button type="button" class="btn btn-outline-danger btn-sm remove-attachment mt-2">
<i class="fas fa-trash"></i> Supprimer
</button>
</div>
{% else %}
<p class="text-muted">Aucun fichier ajouté</p>
{% endfor %}
</div>
</div>
</div>
<div class="col-md-4">
<button type="button" class="btn btn-primary add-modality">Ajouter une modalité</button>
<button type="button" class="btn btn-primary add-modality mb-2">Ajouter une modalité</button>
<button type="button" class="btn btn-outline-primary add-attachment mt-3"><i class="fas fa-plus"></i> Ajouter un fichier</button>
</div>
</div>
</div>
@@ -337,6 +367,50 @@
$(document).on('click', '.remove-modality', function() {
$(this).closest('.modality-item').remove();
});
// 1. Ajouter un fichier
$(document).on('click', '.add-attachment', function(e) {
e.preventDefault();
// On remonte au parent pour trouver le conteneur spécifique à cette question
var $container = $(this).closest('.row').find('.attachments-container');
var prototype = $container.data('prototype');
var index = $container.data('index');
// On remplace le prototype par l'index actuel
var newForm = prototype.replace(/__attachment_prot__/g, index);
// On crée l'élément HTML
var $newItem = $('<div class="attachment-item mb-2"></div>').append(newForm);
// On ajoute un bouton de suppression au nouvel élément
$newItem.append('<button type="button" class="btn btn-outline-danger btn-sm remove-attachment mt-2"><i class="fas fa-trash"></i> Supprimer</button>');
// On ajoute au DOM et on incrémente l'index
$container.append($newItem);
$container.data('index', index + 1);
// Supprimer le message "Aucun fichier" s'il existe
$container.find('p.text-muted').remove();
});
// 2. Supprimer un fichier (existant ou nouveau)
$(document).on('click', '.remove-attachment', function(e) {
e.preventDefault();
$(this).closest('.attachment-item').remove();
});
});
</script>
{% endblock %}