Ajouter champ à formulaire
Je reprends un sujet bien célèbre mais que je dois aborder parce que, bien que non codeur javascript à la base, je dois utiliser ce langage.
Il s'agit du "coup classique" où l'on rajoute un champ dans un formulaire à chaque fois que l'on clique sur le + .
Je vous mets le code dont j'ai repris les principes ici-même. Le HTML comprend les balises Bulma. Si ça vous dérange, je les dégagerai.
Pour l'instant, quand je clique sur l'icone "+" , rien ne se passe.
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
| <div class="field is-horizontal" id="photosForm">
<div class="field-label is-normal">
{{ form_label(form.picture, 'Image(s)') }}
</div>
<div class="field-body" id="loadMoreFiles">
<div class="control">
<div class="file">
<label class="file-label">
{{ form_widget(form.picture) }}
<span class="file-cta">
<span class="file-icon">
<i class="fas fa-upload"></i>
</span>
<span class="file-label">
Choisir un fichier
</span>
</span>
</label>
</div>
</div>
<span class="icon is-medium"><i class="far fa-plus-square" onclick="newField()" id="input"></i></span>
</div>
</div> |
Puis voici le Javascript:
Code:
1
2
3
4
5
6
7
8
| /* Load more images */
function newField() {
var obj = document.getElementById('loadMoreFiles');
var field = obj.cloneNod(true);
inputs = field.getElementById('input');
for (var i =0; i < inputs.length; ++i) inputs[i].value=5;
document.getElementById('photosForm').appendChild('loadMoreFiles');
} |
Précision: la boucle for permet normalement d'autoriser 5 fois l'action.
Si vous voyez mon erreur quelque part, j'apprécierais un coup de main. Merci.
