Pour savoir comment créer un formulaire web visuellement dans Dreamweaver en insérant des éléments de formulaire dans une page, suivez cette procédure.

Vous pouvez créer un formulaire web visuellement dans Dreamweaver en insérant des éléments de formulaire dans une page, mais il ne s’agit que d’une partie de la tâche. L’autre partie, plus complexe, consiste à développer un mécanisme pour traiter les données que vos visiteurs soumettent via le formulaire. Les données sont parfois enregistrées dans une base de données client, par exemple. En règle générale, une technologie d’application web, telle que PHP ou Adobe ColdFusion, gère les données de formulaire.

Cet article explique comment créer un formulaire web simple. Le développement d’un mécanisme de manipulation des données de formulaire transmises n’est pas traité dans l’article. Pour obtenir des instructions détaillées sur la construction de formulaires et un mécanisme de gestion des données transmises avec PHP, consultez cette série de tutoriels sur le Pôle de développement Adobe.

Création d’un formulaire web

  1. Ouvrez une page en mode Création dans Dreamweaver et placez le point d’insertion où vous souhaitez afficher le formulaire.
  2. Sélectionnez Insertion > Formulaire > Formulaire. Sinon, choisissez la catégorie Formulaires du panneau Insertion (le petit triangle au-dessous de l’onglet du panneau), puis cliquez sur l’icône Formulaire. Dreamweaver insère un formulaire vierge. En mode Création, un contour en pointillé rouge indique les formulaires. Si vous ne voyez pas cette bordure, choisissez Affichage > Assistances visuelles > Éléments invisibles.
  3. Indiquez la page ou le script qui traite les données du formulaire. Dans la fenêtre Document, cliquez sur la bordure du formulaire afin de le sélectionner. Dans l’inspecteur Propriétés (Fenêtre > Propriétés), entrez le nom de fichier (et le chemin d’accès, le cas échéant) de la page de traitement dans la zone de texte de l’action de l’inspecteur Propriétés. Ou, cliquez sur l’icône de dossier pour naviguer jusqu’à la page ou jusqu’au script approprié. Par exemple : process_order.php.
  4. Spécifiez la méthode à utiliser pour transmettre les données du formulaire au serveur. Dans l’inspecteur Propriétés, sélectionnez l’une des options du menu contextuel Méthode :
    • L’option POST permet d’incorporer les données du formulaire dans la requête HTTP. Pour plus d’informations, consultez la section Paramètres de formulaire HTML dans l’aide de Dreamweaver.
    • L’option GET permet d’annexer la valeur à l’URL demandant la page. Pour plus d’informations, consultez la section Paramètres d’URL dans l’aide de Dreamweaver.
    • L’option Par défaut permet d’utiliser le paramétrage par défaut du navigateur pour envoyer les données du formulaire au serveur. La valeur par défaut est généralement la méthode GET.
  5. Insérez des objets de formulaire. Placez le point d’insertion à l’endroit où l’objet de formulaire doit apparaître dans le formulaire. Sélectionnez ensuite l’objet dans le menu Insertion >Formulaire, ou dans la catégorie Formulaires de la barre Insertion. Placez les objets de formulaire dans le contour rouge pointillé du formulaire sur la page. Pour plus d’informations sur les objets de formulaire, consultez la section Objets de formulaire dans l’aide de Dreamweaver.

  6. Ajustez la disposition du formulaire. Utilisez des sauts de ligne, des sauts de paragraphe, du texte préformaté ou des tableaux pour mettre en forme vos formulaires. Vous ne pouvez pas insérer un formulaire dans un autre, mais vous pouvez inclure plusieurs formulaires dans une même page. Lors de la conception de formulaires, n’oubliez pas d’étiqueter les objets de formulaire avec un texte descriptif pour permettre aux utilisateurs de savoir à quoi ils répondent. Par exemple, créez un libellé « Indiquez votre nom » pour demander des informations de nom. Utilisez des tableaux pour fournir une structure destinée aux étiquettes et objets de formulaire. Assurez-vous que toutes les balises de tableau sont incluses entre les balises de formulaire.

Ce produit est distribué sous licence Creative Commons Attribution - Pas d’utilisation commerciale - Partage à l’identique 3.0 non transposé  Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.

Mentions légales   |   Politique de confidentialité en ligne