> For the complete documentation index, see [llms.txt](https://docs.devolutions.net/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.devolutions.net/powershell-universal/fr/apps/components/inputs/form.md).

# Formulaire

{% embed url="<https://youtu.be/o8Bl1NsCc2Y>" %}

Les formulaires permettent de collecter des données auprès des utilisateurs.

Les formulaires peuvent inclure n'importe quel type de contrôle. Cela vous permet de personnaliser l'apparence et d'utiliser n'importe quel contrôle de saisie.

Les données saisies via les contrôles de saisie seront renvoyées au bloc de script `OnSubmit` lorsque le formulaire est soumis. Dans le gestionnaire d'événements `OnSubmit`, vous aurez accès à la variable `$EventData` qui contiendra des propriétés pour chacun des champs du formulaire.

Par exemple, si vous avez deux champs, vous aurez deux propriétés sur `$EventData`.

```powershell
New-UDForm -Content {
    New-UDTextbox -Id 'txtTextField'
    New-UDCheckbox -Id 'chkCheckbox'
} -OnSubmit {
    Show-UDToast -Message $EventData.txtTextField
    Show-UDToast -Message $EventData.chkCheckbox
}
```

## Contrôles pris en charge

Les contrôles de saisie suivants s'intègrent automatiquement à un formulaire. Les valeurs définies dans ces contrôles seront envoyées lors de la validation et dans le gestionnaire d'événements `OnSubmit`.

* [Autocomplete](/powershell-universal/fr/apps/components/inputs/automcomplete.md)
* [Checkbox](/powershell-universal/fr/apps/components/inputs/checkbox.md)
* [Date Picker](/powershell-universal/fr/apps/components/inputs/date-picker.md)
* [Radio](/powershell-universal/fr/apps/components/inputs/radio.md)
* [Select](/powershell-universal/fr/apps/components/inputs/select.md)
* [Slider](/powershell-universal/fr/apps/components/inputs/slider.md)
* [Switch](/powershell-universal/fr/apps/components/inputs/switch.md)
* [Textbox](/powershell-universal/fr/apps/components/inputs/textbox.md)
* [Time Picker](/powershell-universal/fr/apps/components/inputs/time-picker.md)
* [Transfer List](/powershell-universal/fr/apps/components/inputs/transfer-list.md)
* [Upload](/powershell-universal/fr/apps/components/inputs/upload.md)

## Formulaire simple

![](/files/sn9s6XemTGLivEUVohiu)

Les formulaires simples peuvent utiliser des contrôles de saisie tels que des zones de texte et des cases à cocher.

```powershell
New-UDForm -Content {
    New-UDTextbox -Id 'txtTextfield'
    New-UDCheckbox -Id 'chkCheckbox'
} -OnSubmit {
    Show-UDToast -Message $EventData.txtTextfield
    Show-UDToast -Message $EventData.chkCheckbox
}
```

## Mise en forme d'un formulaire

![](/files/OpPTf9ChYeAW6Xps9fbc)

Puisque les formulaires peuvent utiliser n'importe quel composant, vous pouvez utiliser des composants de mise en forme standard au sein du formulaire.

```powershell
New-UDForm -Content {

    New-UDRow -Columns {
        New-UDColumn -SmallSize 6 -LargeSize 6 -Content {
            New-UDTextbox -Id 'txtFirstName' -Label 'First Name' 
        }
        New-UDColumn -SmallSize 6 -LargeSize 6 -Content {
            New-UDTextbox -Id 'txtLastName' -Label 'Last Name'
        }
    }

    New-UDTextbox -Id 'txtAddress' -Label 'Address'

    New-UDRow -Columns {
        New-UDColumn -SmallSize 6 -LargeSize 6  -Content {
            New-UDTextbox -Id 'txtState' -Label 'State'
        }
        New-UDColumn -SmallSize 6 -LargeSize 6  -Content {
            New-UDTextbox -Id 'txtZipCode' -Label 'ZIP Code'
        }
    }

} -OnSubmit {
    Show-UDToast -Message $EventData.txtFirstName
    Show-UDToast -Message $EventData.txtLastName
}
```

## Retour de composants

Lorsqu'un formulaire est soumis, vous pouvez éventuellement retourner un autre composant pour remplacer le formulaire sur la page. Vous pouvez retourner n'importe quel composant Universal Dashboard. Il vous suffit de vous assurer que le composant est écrit dans le pipeline au sein du gestionnaire d'événements `OnSubmit`.

```powershell
New-UDForm -Content {
    New-UDTextbox -Id 'txtTextfield'
} -OnSubmit {
    New-UDTypography -Text $EventData.txtTextfield
}
```

## Validation d'un formulaire

La validation d'un formulaire peut être accomplie en utilisant le paramètre de bloc de script OnValidate.

```powershell
New-UDForm -Content {
    New-UDTextbox -Id 'txtValidateForm'
} -OnValidate {
    $FormContent = $EventData

    if ($FormContent.txtValidateForm -eq $null -or $FormContent.txtValidateForm -eq '') {
        New-UDFormValidationResult -ValidationError "txtValidateForm is required"
    } else {
        New-UDFormValidationResult -Valid
    }
} -OnSubmit {
    Show-UDToast -Message $Body
}
```

## Annulation d'un formulaire

Vous pouvez définir un gestionnaire d'événements `-OnCancel` à invoquer lorsque le bouton d'annulation est pressé. Cela peut être utilisé pour effectuer des actions telles que fermer une fenêtre modale.

```powershell
New-UDButton -Text 'On Form' -OnClick {
    Show-UDModal -Content {
        New-UDForm -Content {
            New-UDTextbox -Label 'Hello'
        } -OnSubmit {
            Show-UDToast -Message 'Submitted!'
            Hide-UDModal
        } -OnCancel {
            Hide-UDModal
        }
    }
}
```

## Affichage de la sortie sans remplacer le formulaire

Bien que vous puissiez retourner des composants directement depuis un formulaire, vous souhaiterez peut-être conserver le formulaire afin que les utilisateurs puissent saisir à nouveau des données. Pour ce faire, vous pouvez utiliser `Set-UDElement` et un élément de remplacement dont vous pouvez définir le contenu.

Dans cet exemple, nous avons un formulaire vide qui, une fois soumis, met à jour l'élément `results` avec un UDCard.

```powershell
New-UDForm -Content {

} -OnSubmit {
   Set-UDElement -Id 'results' -Content {
      New-UDCard -Content { "Hello " + (Get-Date) }
   }
}

New-UDElement -Id 'results' -Tag 'div'
```

## Formulaires basés sur un schéma

Au lieu de définir toute la mise en page et la logique des formulaires à l'aide de cmdlets, vous pouvez également définir un formulaire basé sur une table de hachage de schéma. Cette version des formulaires est basée sur [react-jsonschema-form](https://rjsf-team.github.io/react-jsonschema-form/docs/).

### Champs

Vous définissez des champs qui acceptent les types string, number, integer, enum et boolean. Cela modifie le type de saisie affiché.

```powershell
New-UDForm -Schema @{
   title = "Test Form"
   type = "object"
   properties = @{
       name = @{
           type = "string"
       }
       age = @{
           type = "number"
       }
   }
} -OnSubmit {
   # $EventData.name
   # $EventData.age
}
```

### Propriétés obligatoires

Vous pouvez utiliser la propriété `required` pour définir une liste de propriétés obligatoires.

```powershell
New-UDForm -Schema @{
   title = "Test Form"
   type = "object"
   properties = @{
       name = @{
           type = "string"
       }
       age = @{
           type = "number"
       }
   }
   required = @('name')
} -OnSubmit {
   # $EventData.name
   # $EventData.age
}
```

{% hint style="warning" %}
Notez que les propriétés doivent être en minuscules ! Par exemple, vous devez vous assurer que les clés de votre table de hachage de propriétés sont en minuscules et que la liste des propriétés obligatoires l'est également.
{% endhint %}

### Ordre

Vous pouvez utiliser la propriété `schemaUI` pour modifier l'ordre des champs.

```powershell
New-UDForm -Schema @{
        title = "Test"
        type = "object"
        properties = @{
            hostname = @{
                title = "Hostname"
                type = "string"
                }
            ipaddress= @{
                title = "IP Address"
                type = "string"
                format = "ipv4"
                }
            description = @{
                title = "Server Description"
                type = "string"
                }
            servertype = @{
                title = "Server Type"
                type = "string"                            
                enum = "App","DB"
                }
            environment = @{
                title = "Environment"
                type = "string"
                enum = "Prod", "Dev" , "QA"
                }
            }
		required = @('hostname','ipaddress','description','servertype','environment')                    
	} -uiSchema @{
		"ui:order" = @('environment','hostname','ipaddress','description')
	} -OnSubmit {
		Show-UDModal -Content {                        
			New-UDTypography -Text $EventData
		} -Footer {
			New-UDButton -Text "Close" -OnClick {Hide-UDModal}
		} -Persistent
	}
```

### Tableaux

Vous pouvez créer des formulaires qui acceptent de zéro à plusieurs objets. L'utilisateur pourra ajouter et supprimer des objets dans le formulaire.

```powershell
New-UDForm -Schema @{
   title = "Test Form"
   type = "array"
   items = @{
      type = "object" 
       properties = @{
           name = @{
               type = "string"
           }
           age = @{
               type = "number"
           }
       }
   }
} -OnSubmit {
   # $EventData[0].name
   # $EventData[0].age
}
```

## Formulaires basés sur des scripts

Vous pouvez générer automatiquement des formulaires à partir de scripts de votre environnement PowerShell Universal. Les formulaires basés sur des scripts génèrent des composants de saisie basés sur le bloc `param`. Ces formulaires prennent automatiquement en charge la progression et les retours d'information.

Les formulaires basés sur des scripts prennent également en charge l'affichage de la sortie sous forme de texte ou de tableau.

```powershell
New-UDForm -Script "Script.ps1" -OutputType 'text'
```

## API

* [New-UDForm](https://github.com/ironmansoftware/universal-docs/blob/v5/cmdlets/New-UDForm.txt)
* [New-UDFormValidationResult](https://github.com/ironmansoftware/universal-docs/blob/v5/cmdlets/New-UDValidationResult.txt)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.devolutions.net/powershell-universal/fr/apps/components/inputs/form.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.