Téléchargement d'image plus affichage en fond
Bonjours à tous,
Je suis la car j'ai un soucis avec mon script. Alors je créer une méthode pour télécharger une image sous symfony4 ( jusque la tout va bien c'est juste le style le problème ). Je ne trouve pas ça énormément pratique avec les formes et le style a gérer avec symfony4 mais bon je n'ai pas le choix.
Donc lorsque j'affiche dans ma vue, je l'affiche comme ça :
Code:
{{ form_widget(form.image, { 'id': 'img-result', 'attr': { 'class' : 'no-image' }}) }}
Rien de plus normale, et voici mon scripte :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
<script>
(function () {
var uploader = document.createElement('input'),
image = document.getElementById('img-result');
uploader.type = 'file';
uploader.accept = 'image/*';
image.onclick = function () {
uploader.click();
};
uploader.onchange = function () {
var reader = new FileReader();
reader.onload = function (evt) {
image.classList.remove('no-image');
image.style.backgroundImage = 'url(' + evt.target.result + ')';
var request = {
itemtype: 'test 1',
brand: 'test 2',
images: [{
data: evt.target.result
}]
};
};
reader.readAsDataURL(uploader.files[0]);
};
document.querySelector('.hide-button').onclick = function () {
document.querySelector('.upload-result').style.display = 'none';
};
document.querySelector('.show-button').onclick = function () {
document.querySelector('.upload-result').style.display = 'block';
};
})();
</script> |
Je précise quand même que ma forme est du type suivant :
Code:
->add('image', FileType::class)
Donc le gros problème est lorsque je veux uploader une image, j'ai deux fenêtres de téléchargement pour choisir mon fichier.
La première concerne uniquement la VRAI photo qui va être publié, la deuxième (qui n'arrive seulement après avoir finit la première étape) elle va juste compléter le fond.
Je ne comprends car peut importe ce que je fais j'ai toujours ces deux fenêtres.. Merci aux personne qui m'aideront :)
