Discussion :

[MInfo25]

Bonjour

J'aimerais créer un bouton dans mon formulaire qui génère à chaque clic, 3 champs (1 textarea et 2 input), je ne sais pas comment faire cela. J'arrive bien à créer des formulaires à partir des entités.

Merci d'avance de votre aide

[moimp]

En vrac:
Remarque n°1
Il me semble que ce serait mieux en javascript pour ne pas avoir à recharger la page à chaque validation du formulaire.
Remarque n°2
Il faudrait préciser ton objectif: A quoi servent tes trois champs; Comporte t'ils toujours les mêmes données?
Remarque n°3
Peux-tu donner le code de ce que tu as déjà fait?

[MInfo25]

Voici ma fonction qui génère le formulaire :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
public function buildForm(FormBuilderInterface $builder, array $options)    {
        $builder
            ->add('num')
            ->add('numtva')
            ->add('datefacture')
            ->add('facturede')
            ->add('client')
            ->add('conditions')
            ->add('designation')
            ->add('quantite')
            ->add('prixht')
            ->add('taxe')
            ->add('button', ButtonType::class, array('label' => 'Ajouter'));
    }

J'aimerais qu'a chaque fois qu'on clique sur le bouton "Ajouter" (

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

 ->add('button', ButtonType::class, array('label' => 'Ajouter'));

), ces 4 champs s'ajoutent au formulaire :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
->add('designation')
->add('quantite')
->add('prixht')
 ->add('taxe')

[MInfo25]

Pour infos j'arrive à le faire sans symfony comme ceci :
Voici les fonctions javascript:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function ajout(element){        
var container = document.getElementById('ID_container');
 
 
        var str ='<br/><span><textarea name="designation[]" rows="4" type="text" placeholder="Designation"></textarea>    </span><span><input name="quantite[]" type="number" placeholder="Quantité">    </span><span><input name="prixht[]" type="number" step="0.01" placeholder="Prix HT">    </span><span><input name="taxe[]" type="text" step="0.01" placeholder="Taxe en %">    </span><span><button type="button" class="supprimer" onclick="suppression(this)">x</button></span><br/>';
        var divNewExp = document.createElement("div");
        divNewExp.innerHTML = str ;
        container.appendChild(divNewExp);
 
 
      }
 
 
function suppression(element){
        var container = document.getElementById('ID_container');
        container.removeChild(element.parentNode.parentNode);
      }

Et voici mon HTML avec le bouton:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
  <div id="ID_container">
            <textarea name="designation[]" rows="4"
              placeholder="Designation" required></textarea>
            <input type="number" placeholder="Quantité" name="quantite[]" required>
            <input type="number" step="0.01" placeholder="Prix HT" name="prixht[]" required>
            <input name="taxe[]" type="text" step="0.01" placeholder="Taxe en %" required>
          </div><br/>
            <button type="button" class="boutonAjout" onclick="ajout(this);">+ Ajouter une designation</button>

Je me demande si avec symfony, je devrais faire autrement.

[moimp]

Bonjour,
J'ai voulu te faire poser de bonnes question car dans ton message d'origine tu ne parles pas de symphony de javascript et ne donne pas de code. Je ne connais pas symphony et ne peux pas t'aider sur ce point. Mais c'est déjà plus clair avec ce que tu as écrit et d'autres pourront certainement mieux t'aider que moi.

[MehrezLabidi]

Bonjour,

Je me souviens qu'il y a une solution standard en symfony pour générer des inputs js dans un form symfony.
Pour un besoin pareil , j'ai utilisé du JQuery classique pour faire un " append " de ce que tu veux ( inputs , boutons radios etc ..)

Un petit conseil "User experience" , c'est bien de prévoir et mettre une valeur limite pour la génération de ces composants DOM si non l'utilisateur peut générer une vingtaine , une centaine .. rien de l’empêche et ça peut être moche.

En Symfony , on peut récupérer la liste des valeurs insérés dans les inputs dans une request GET.

D'autres conseils "User experience" :
- inutile de générer 3 champs (1 textarea et 2 input) et de générer 3 autres pour un deuxième clic , quand les 3 premiers sont vides !! ( c'est beau de valider en JS )
- après un submit , si on suppose que le formulaire est invalide, c'est bien important de garder les derniers valeurs insérés par l'utilisateur .

[armel18]

Dans un formulaire symfony, il y a un type de champ appelé CollectionType qui permet de représenter une collection (équivalent d'un array) d'objets( collection de produits). Avec ce type de champ on peut ajouter(via l'option allow_add) un objet à une collection de produits comme on peut en retirer(via l'option allow_delete). Un exemple sur la doc officielle form_collections.html

[MInfo25]

Dans un formulaire symfony, il y a un type de champ appelé CollectionType qui permet de représenter une collection (équivalent d'un array) d'objets( collection de produits). Avec ce type de champ on peut ajouter(via l'option allow_add) un objet à une collection de produits comme on peut en retirer(via l'option allow_delete). Un exemple sur la doc officielle form_collections.html

Oui je crois que la solution vient de ce que tu me propose, cad les "Collection of Forms", je regarde ça en détail et je vous dis.
Merci

[MInfo25]

Effectivement la réponse à mon problème est celle proposée par @armel18 sur la doc officielle form_collections.html. Mais ça me demande un peu de temps à comprendre tout ça du coup je ferme le post !