Partager via

Obtenir une entrée utilisateur avec des formulaires

Précédent : Afficher le contenu markdown

Maintenant que nous savons comment présenter du contenu markdown de base, essayons d’afficher quelque chose de plus élaboré en tirant parti de la puissance des cartes adaptatives. Cela est utile pour créer des formulaires ou pour afficher du contenu plus complexe.

Utilisation des formulaires

La palette de commandes prend en charge les cartes adaptatives, qui constituent un moyen de créer du contenu riche et interactif. Cela peut être utile pour créer des formulaires ou pour afficher du contenu plus complexe.

Vous pouvez créer une carte dans la palette de commandes avec l’interface IFormContent (voir FormContent pour l’implémentation du kit de ressources). Cela vous permet de fournir le JSON de la carte adaptative, et la palette de commandes le rend pour vous. Lorsque l’utilisateur envoie le formulaire, la palette de commandes appelle la méthode SubmitForm sur votre formulaire, avec la charge utile JSON et les entrées du formulaire.

Vous pouvez créer des charges utiles de carte adaptative à l’aide du Concepteur de cartes adaptatives. Vous pouvez concevoir votre carte là-bas, puis copier la charge utile JSON dans votre extension.

Pour obtenir un exemple complet d’utilisation de formulaires et de pages de contenu, accédez à SamplePagesExtension/Pages/SampleContentPage.cs. Voici quelques points à noter :

  • Définissez la propriété TemplateJson de votre formulaire sur la charge utile JSON de votre carte adaptative. (il s’agit de la valeur « CARD PAYLOAD EDITOR » dans le Concepteur de cartes adaptatives)
  • Définissez la propriété DataJson de votre FormContent sur les données que vous souhaitez utiliser pour remplir votre modèle de carte. (Il s’agit de la valeur « SAMPLE DATA EDITOR » dans le Concepteur de cartes adaptatives). Cela est facultatif, mais peut faciliter la création de cartes.
  • Implémentez la méthode SubmitForm pour gérer l’envoi du formulaire. Cette méthode est appelée lorsque l’utilisateur envoie le formulaire et passe la charge utile JSON du formulaire.
public override CommandResult SubmitForm(string payload)
{
    var formInput = JsonNode.Parse(payload)?.AsObject();
    if (formInput == null)
    {
        return CommandResult.GoHome();
    }

    // retrieve the value of the input field with the id "name"
    var name = formInput["name"]?.AsString();
        
    // do something with the data

    // and eventually
    return CommandResult.GoBack();
}

Bien sûr, vous pouvez mélanger et faire correspondre IContent de quelque façon que vous le souhaitez. Par exemple, vous pouvez utiliser un markdown de bloc pour le corps d’un billet et avoir un FormContent à côté pour répondre au billet.

Contenu connexe

  • Last updated on