multiplier.texy

Multiplicateur : Composants dynamiques
**************************************

Un outil pour la création dynamique de composants interactifs .[perex]

Commençons par un problème typique : nous avons une liste de produits sur un site de commerce électronique et nous voulons accompagner chaque produit d'un formulaire *add to cart*. L'une des solutions consiste à regrouper toute la liste dans un seul formulaire. Un moyen plus pratique est d'utiliser [api:Nette\Application\UI\Multiplier].

Multiplier vous permet de définir une usine pour plusieurs composants. Il est basé sur le principe des composants imbriqués - chaque composant héritant de [api:Nette\ComponentModel\Container] peut contenir d'autres composants.

Voir le [modèle de composant |components#Components in Depth] dans la documentation. .[tip]

Multiplier se pose comme un composant parent qui peut créer dynamiquement ses enfants en utilisant le callback passé dans le constructeur. Voir l'exemple :

```php
protected function createComponentShopForm(): Multiplier
{
	return new Multiplier(function () {
		$form = new Nette\Application\UI\Form;
		$form->addInteger('amount', 'Amount:')
			->setRequired();
		$form->addSubmit('send', 'Add to cart');
		return $form;
	});
}
```

Dans le modèle, nous pouvons rendre un formulaire pour chaque produit - et chaque formulaire sera effectivement un composant unique.

```latte
{foreach $items as $item}
	<h2>{$item->title}</h2>
	{$item->description}

	{control "shopForm-$item->id"}
{/foreach}
```

L'argument passé à la balise `{control}` dit :

1. obtenir un composant `shopForm`
2. et retourne son enfant `$item->id`

Lors du premier appel de **1.** le composant `shopForm` n'existe pas encore, la méthode `createComponentShopForm` est donc appelée pour le créer. Une fonction anonyme passée en paramètre à Multiplier, est ensuite appelée et un formulaire est créé.

Dans les itérations suivantes de `foreach`, la méthode `createComponentShopForm` n'est plus appelée car le composant existe déjà. Mais comme nous faisons référence à un autre enfant (`$item->id` varie entre les itérations), une fonction anonyme est à nouveau appelée et un nouveau formulaire est créé.

La dernière chose à faire est de s'assurer que le formulaire ajoute effectivement le bon produit au panier car dans l'état actuel, tous les formulaires sont identiques et nous ne pouvons pas distinguer à quels produits ils appartiennent. Pour cela nous pouvons utiliser la propriété de Multiplier (et en général de toute méthode de fabrique de composant dans Nette Framework) que chaque méthode de fabrique de composant reçoit le nom du composant créé comme premier argument. Dans notre cas, ce serait `$item->id`, ce qui est exactement ce dont nous avons besoin pour distinguer les produits individuels. Tout ce que vous avez à faire est de modifier le code de création du formulaire :

```php
protected function createComponentShopForm(): Multiplier
{
	return new Multiplier(function ($itemId) {
		$form = new Nette\Application\UI\Form;
		$form->addInteger('amount', 'Amount:')
			->setRequired();
		$form->addHidden('itemId', $itemId);
		$form->addSubmit('send', 'Add to cart');
		return $form;
	});
}
```