Guide d'utilisation Annuler

Création de pages principales et détaillées sous Dreamweaver

 

 

Remarque :

L’interface utilisateur a été simplifiée sous Dreamweaver CC et versions ultérieures. Par conséquent, il se peut que vous ne trouviez pas certaines options décrites dans cet article sous Dreamweaver CC et versions ultérieures. Pour plus d’informations, consultez cet article.

À propos des pages principales et détaillées

Les pages principales et détaillées sont des ensembles de pages utilisées pour organiser et afficher les données d’un jeu d’enregistrements. Ces pages fournissent aux visiteurs de votre site une vue d’ensemble et une vue détaillée. La page principale présente tous les enregistrements et contient des liens vers des pages de détails qui fournissent des informations complémentaires sur chaque enregistrement.

Page principale

Page de détails

Vous pouvez créer des pages principales et des pages de détails en insérant un objet de données destiné à créer une page principale et une page de détails en une seule opération, ou en utilisant des comportements de serveur pour créer ces pages d’une manière plus personnalisée. Si vous employez des comportements de serveur pour créer des pages principales et détaillées, vous devez tout d’abord créer une page principale contenant la liste des enregistrements, puis ajouter des liens vers les pages de détails depuis cette liste.

Création d’une page principale

Avant de commencer, vérifiez que vous avez défini une connexion de base de données pour le site.

  1. Pour créer une page vierge, choisissez Fichier > Nouveau > Page vierge, sélectionnez un type de page puis cliquez sur Créer. Cette page devient la page principale.
  2. Définissez un jeu d’enregistrements.

    Dans le panneau Liaisons (Fenêtre > Liaisons), cliquez sur le bouton Plus (+), sélectionnez Jeu d’enregistrements puis choisissez les options. Si vous voulez rédiger votre propre instruction SQL, cliquez sur Avancé.

    Vérifiez que le jeu d’enregistrements contient toutes les colonnes de table nécessaires à la création de la page principale. Le jeu d’enregistrements doit contenir la colonne comportant la clé unique de chacun des enregistrements, à savoir la colonne d’ID d’enregistrement. Dans l’exemple suivant, la colonne Code contient la clé unique de chaque enregistrement.

    Colonnes de jeu d’enregistrements sélectionnées pour une page principale

    En général, le jeu d’enregistrements de la page principale extrait quelques colonnes d’un tableau de base de données tandis que celui de la page de détails extrait davantage de colonnes du même tableau afin de fournir des détails supplémentaires.

    Le jeu d’enregistrements peut être défini par l’utilisateur au moment de l’exécution. Pour plus d’informations, consultez la rubrique Création de pages de recherche/résultats.

  3. Insérez un tableau dynamique afin d’afficher les enregistrements.

    Placez le point d’insertion où vous voulez placer le tableau dynamique sur la page. Choisissez Insertion > Objets de données > Données dynamiques > Tableau dynamique, définissez les options puis cliquez sur OK.

    Si vous souhaitez que les utilisateurs ne puissent pas voir les ID d’enregistrement, supprimez la colonne correspondante du tableau dynamique. Cliquez dans la page afin de la rendre active. Déplacez le curseur vers le haut de la colonne dans le tableau dynamique jusqu’à ce que les cellules de la colonne s’affichent avec un contour rouge, puis cliquez sur la colonne. Appuyez sur la touche Suppr pour supprimer la colonne du tableau.

Après avoir créé la page principale et ajouté le jeu d’enregistrements, vous devez créer des liens permettant d’ouvrir la page de détails. Vous devez ensuite modifier les liens de manière à transmettre les ID des enregistrements sélectionnés par l’utilisateur. La page de détails utilise cet ID pour rechercher l’enregistrement demandé dans la base de données et l’afficher.

Remarque :

La création de liens vers les pages de mises à jour s’effectue de la même manière. La page de résultats est similaire à une page principale, et la page de mises à jour à une page de détails.

Ouverture de la page de détails et transfert d’un ID d’enregistrement (ColdFusion, PHP)

  1. Dans le tableau dynamique, sélectionnez l’espace réservé pour le texte qui servira de lien.
    Les liens appliqués à l’espace réservé sont sélectionnés.

  2. Dans l’inspecteur Propriétés, cliquez sur l’icône du dossier située en regard de la zone Lien.
  3. Parcourez vos fichiers afin de sélectionner la page de détails. Celle-ci apparaît dans la zone Lien de l’inspecteur Propriétés.

    Dans le tableau dynamique, le texte sélectionné apparaît lié. Lorsque la page s’exécute sur le serveur, le lien s’applique au texte de chaque ligne du tableau.

  4. Dans la page principale, sélectionnez le lien dans le tableau dynamique.
  5. (ColdFusion) Dans la zone Lien de l’inspecteur Propriétés, ajoutez la chaîne suivante à la fin de l’URL :
    ?recordID=#recordsetName.fieldName#
    ?recordID=#recordsetName.fieldName#
    ?recordID=#recordsetName.fieldName#

    Le point d’interrogation indique au serveur que ce qui suit correspond à un ou plusieurs paramètres d’URL. Le mot recordID correspond au nom du paramètre d’URL (vous pouvez inventer n’importe quel nom de votre choix). Notez le nom du paramètre d’URL : vous devrez en effet l’utiliser ultérieurement au niveau de la page de détails.

    L’expression qui suit le signe égal correspond à la valeur du paramètre. Dans ce cas, la valeur est générée par une expression ColdFusion qui renvoie un ID d’enregistrement du jeu d’enregistrements. Un ID différent est généré pour chaque ligne du tableau dynamique. Dans l’expression ColdFusion, remplacez recordsetName par le nom de votre jeu d’enregistrements et remplacez fieldName par le nom du champ de votre jeu d’enregistrements qui permet d’identifier chaque enregistrement de façon univoque. Dans la plupart des cas, le champ correspond à un numéro d’ID d’enregistrement. Dans l’exemple suivant, le champ correspond à des codes de location uniques.

    locationDetail.cfm?recordID=#rsLocations.CODE#
    locationDetail.cfm?recordID=#rsLocations.CODE#
    locationDetail.cfm?recordID=#rsLocations.CODE#

    Lorsque la page s’exécute, les valeurs du champ CODE du jeu d’enregistrements sont insérées dans les lignes correspondantes du tableau dynamique. Par exemple, si le point de location Canberra, Australie, possède le code CBR, l’URL suivante est utilisée dans la ligne Canberra du tableau dynamique :

    locationDetail.cfm?recordID=CBR
    locationDetail.cfm?recordID=CBR
    locationDetail.cfm?recordID=CBR
  6. (PHP) Dans le champ Lien de l’inspecteur Propriétés, ajoutez la chaîne suivante à la fin de l’URL :
    ?recordID=<?php echo $row_recordsetName['fieldName']; ?>
    ?recordID=<?php echo $row_recordsetName['fieldName']; ?>
    ?recordID=<?php echo $row_recordsetName['fieldName']; ?>

    Le point d’interrogation indique au serveur que ce qui suit correspond à un ou plusieurs paramètres d’URL. Le mot recordID correspond au nom du paramètre d’URL. (Vous pouvez utiliser le nom de votre choix.) Notez le nom du paramètre d’URL : vous devrez en effet l’utiliser ultérieurement au niveau de la page de détails.

    L’expression qui suit le signe égal correspond à la valeur du paramètre. Dans ce cas, la valeur est générée par une expression PHP qui renvoie un ID d’enregistrement du jeu d’enregistrements. Un ID différent est généré pour chaque ligne du tableau dynamique. Dans l’expression PHP, remplacez recordsetName par le nom de votre jeu d’enregistrements et fieldName par le nom du champ de votre jeu d’enregistrements qui permet d’identifier chaque enregistrement de façon univoque. Dans la plupart des cas, le champ correspond à un numéro d’ID d’enregistrement. Dans l’exemple suivant, le champ correspond à des codes de location uniques.

    locationDetail.php?recordID=<?php echo $row_rsLocations['CODE']; ?>
    locationDetail.php?recordID=<?php echo $row_rsLocations['CODE']; ?>
    locationDetail.php?recordID=<?php echo $row_rsLocations['CODE']; ?>

    Lorsque la page s’exécute, les valeurs du champ CODE du jeu d’enregistrements sont insérées dans les lignes correspondantes du tableau dynamique. Par exemple, si le point de location Canberra, Australie, possède le code CBR, l’URL suivante est utilisée dans la ligne Canberra du tableau dynamique :

    locationDetail.php?recordID=CBR
    locationDetail.php?recordID=CBR
    locationDetail.php?recordID=CBR
  7. Enregistrez la page.

Ouverture de la page de détails et transfert d’un ID d’enregistrement (ASP)

  1. Sélectionnez le contenu dynamique devant assurer la fonction de lien.
  2. Dans le panneau Comportements de serveur (Fenêtre > Comportements de serveur), cliquez sur le bouton Plus (+) et choisissez Aller à la page de détails dans le menu déroulant.
  3. Dans la boîte de dialogue page de détails, cliquez sur Parcourir et recherchez la page.
  4. Indiquez la valeur à lui transmettre en sélectionnant un jeu d’enregistrements et une colonne dans les menus déroulants Jeu d’enregistrements et Colonne. Cette valeur, telle que l’ID de clé unique, est généralement propre à l’enregistrement.
  5. Si vous le souhaitez, vous pouvez transmettre les paramètres de page existants à la page de détails en sélectionnant les options Paramètres d’URL ou Paramètres de formulaire.
  6. Cliquez sur OK.

    Un lien spécial entoure le texte sélectionné. Lorsque l’utilisateur clique sur le lien, le comportement de serveur Aller à la page de détails transmet à cette même page un paramètre d’URL contenant l’ID de l’enregistrement. Prenons l’exemple d’un paramètre d’URL appelé id et d’une page de détails appelée customerdetail.asp ; lorsque l’utilisateur clique sur le lien, l’URL se présente comme suit :

    http://www.mysite.com/customerdetail.asp?id=43

    La première partie de l’URL, http://www.mysite.com/customerdetail.asp, ouvre la page. La deuxième partie, ?id=43, constitue le paramètre d’URL. Elle précise à la page de détails quel enregistrement trouver et afficher. Le terme id est le nom du paramètre d’URL et sa valeur est 43. Dans cet exemple, le paramètre d’URL contient le numéro d’ID de l’enregistrement, soit 43.

Recherche de l’enregistrement demandé et affichage dans la page de détails

Pour pouvoir afficher l’enregistrement demandé par la page principale, vous devez définir un ensemble de données devant contenir un seul enregistrement et lier les colonnes de l’ensemble de données à la page de détails.

  1. Passez à la page de détails. Si vous n’avez pas encore créé une page de détails, créez une page ColdFusion vierge (Fichier > Nouveau).
  2. Dans le panneau Liaisons (Fenêtre > Liaisons), cliquez sur le bouton Plus (+) et sélectionnez Jeu d’enregistrements (Requête) ou Jeu de données (Requête) dans le menu déroulant.

    La boîte de dialogue Jeu d’enregistrements ou Jeu de données simplifiée s’affiche. Si la boîte de dialogue avancée s’affiche, cliquez sur Simple.

  3. Donnez un nom au jeu d’enregistrements, puis sélectionnez la source de données et la table de base de données qui fourniront les données de votre jeu d’enregistrements.
  4. Dans la zone Colonnes, sélectionnez les colonnes du tableau à inclure dans le jeu d’enregistrements.

    Le jeu d’enregistrements peut être identique ou différent du jeu de la page principale. Le jeu d’enregistrements d’une page de détails possède généralement davantage de colonnes afin d’afficher plus de détails.

    Si les jeux d’enregistrements sont différents, le jeu d’enregistrements de la page de détails doit avoir au moins une colonne en commun avec celui de la page principale. La colonne commune est généralement la colonne d’ID de l’enregistrement, mais elle peut également être le champ commun aux tableaux reliés.

    Pour inclure uniquement certaines colonnes de la table dans le jeu d’enregistrements, cliquez sur Sélectionnées, puis cliquez sur les colonnes souhaitées tout en maintenant la touche Ctrl (Windows) ou Commande (Macintosh) enfoncée.

  5. Pour rechercher et afficher l’enregistrement spécifié dans le paramètre d’URL transmis par la page principale, renseignez la section Filtre comme suit :
    • Dans le premier menu déroulant de la zone Filtre, sélectionnez la colonne du jeu d’enregistrements contenant les valeurs correspondant à celle du paramètre d’URL transmis par la page principale. Par exemple, si le paramètre d’URL contient un numéro d’ID d’enregistrement, sélectionnez la colonne contenant les numéros d’ID d’enregistrement. Dans l’exemple de la section précédente, la colonne intitulée CODE contient les valeurs correspondant à celle du paramètre d’URL transmis par la page principale.

    • Dans le menu déroulant situé à côté du premier menu, sélectionnez le signe égal (=) (si cela n’est pas déjà fait).

    • Dans le troisième menu déroulant, choisissez Paramètre d’URL. La page principale utilise un paramètre d’URL pour transmettre des informations à la page de détails.

    • Dans la quatrième zone, tapez le nom du paramètre d’URL transmis par la page principale.

  6. Cliquez sur OK. Le jeu d’enregistrements s’affiche dans le panneau Liaisons.
  7. Liez les colonnes du jeu d’enregistrements à la page de détails ; pour ce faire, sélectionnez les colonnes dans le panneau Liaisons (Fenêtre > Liaisons) et faites-les glisser sur la page.

    Après avoir téléchargé la page principale et la page de détails sur le serveur, vous pouvez ouvrir la page principale dans un navigateur. Lorsque vous cliquez sur un lien dans la page principale, la page de détails correspondante s’ouvre et affiche des informations sur l’enregistrement sélectionné.

Recherche d’un enregistrement précis et affichage sur une page (ASP)

Vous pouvez ajouter un comportement de serveur permettant de rechercher un enregistrement spécifique dans le jeu d’enregistrements, de manière à afficher les données de l’enregistrement sur la page. Vous ne pouvez recourir au comportement de serveur que si vous utilisez le modèle de serveur ASP.

  1. Créez une page répondant aux conditions suivantes :
  2. Ajoutez le comportement de serveur afin de trouver l’enregistrement spécifié par le paramètre d’URL. Pour ce faire, cliquez sur le bouton Plus (+) du panneau Comportements de serveurs (Fenêtre > Comportements de serveur), puis choisissez Pagination du jeu d’enregistrements > Déplacer vers un enregistrement spécifique.
  3. Dans le menu déroulant Déplacer vers l’enregistrement dans, sélectionnez le jeu que vous avez défini pour la page.
  4. Dans le menu déroulant Où la colonne, sélectionnez la colonne contenant la valeur transmise par l’autre page.

    Par exemple, si cette page transmet un numéro d’ID d’enregistrement, sélectionnez la colonne contenant les numéros d’ID d’enregistrement.

  5. Dans la zone Correspond au paramètre d’URL, entrez le nom du paramètre d’URL transmis par l’autre page.

    Par exemple, si celle-ci a utilisé l’URL id=43 pour ouvrir la page d’informations détaillées, tapez id dans la zone Correspond au paramètre d’URL.

  6. Cliquez sur OK.

    Lorsque le navigateur enverra une nouvelle requête en vue d’obtenir la page, le comportement de serveur lira l’ID d’enregistrement dans le paramètre d’URL transmis par l’autre page et passera à l’enregistrement spécifié dans le jeu d’enregistrements.

Création de pages principale et de détails en une seule opération

Lorsque vous développez des applications Web, vous pouvez créer rapidement des pages principales et de détails à l’aide de l’objet de données Ensemble de pages Principale-Détails.

  1. Pour créer une page dynamique vierge, choisissez Fichier > Nouveau > Page vierge, sélectionnez une page dynamique dans la liste Type de page, puis cliquez sur Créer.

    Cette page devient la page principale.

  2. Définissez un jeu d’enregistrements pour la page.

    Assurez-vous que le jeu d’enregistrements contient non seulement toutes les colonnes nécessaires pour la page principale, mais également celles nécessaires pour la page de détails. En général, le jeu d’enregistrements de la page principale extrait quelques colonnes d’un tableau de base de données tandis que celui de la page de détails extrait davantage de colonnes du même tableau afin de fournir des détails supplémentaires.

  3. Ouvrez la page principale en mode Création, puis sélectionnez Insertion > Objets de données > Ensemble de pages Principale Détails.
  4. Dans le menu déroulant Jeu d’enregistrements, assurez-vous d’avoir sélectionné le jeu contenant les enregistrements que vous souhaitez afficher dans la page principale.
  5. Dans la zone Champs de la page principale, sélectionnez les colonnes du jeu d’enregistrements à afficher dans la page principale.

    Par défaut, toutes les colonnes du jeu d’enregistrements sont sélectionnées. Si le jeu contient une colonne à clé unique, telle que recordID, sélectionnez-la, puis cliquez sur le bouton Moins (-) afin qu’elle ne s’affiche pas sur votre page.

  6. Pour modifier l’ordre d’apparition des colonnes dans la page principale, sélectionnez une colonne dans la liste, puis cliquez sur la flèche vers le bas ou vers le haut.

    Dans la page principale, les colonnes du jeu d’enregistrements sont disposées horizontalement dans un tableau. Un clic sur la flèche vers le haut déplace la colonne vers la gauche ; un clic sur la flèche vers le bas déplace la colonne vers la droite.

  7. Dans le menu déroulant Lier à la page de détails depuis, sélectionnez la colonne du jeu d’enregistrements qui affichera une valeur servant également de lien vers la page de détails.

    Par exemple, si vous souhaitez que chaque nom de produit de la page principale ait un lien vers la page de détails, sélectionnez la colonne du jeu d’enregistrements contenant les noms de produit.

  8. Dans le menu déroulant Passer la clé unique, sélectionnez la colonne du jeu d’enregistrements contenant les valeurs identifiant les enregistrements.

    En général, la colonne choisie est le numéro d’identification de l’enregistrement. Cette valeur est transmise à la page de détails afin d’identifier l’enregistrement choisi par l’utilisateur.

  9. Si la colonne à clé unique n’est pas numérique, désactivez l’option Numérique.
    Remarque :

    Cette option est sélectionnée par défaut ; elle existe seulement pour certains modèles de serveur.

  10. Spécifiez le nombre d’enregistrements devant s’afficher dans la page principale.
  11. Dans la zone Nom de la page de détails, cliquez sur Parcourir et localisez le fichier de page de détails que vous avez créé ou bien entrez un nom et laissez à l’objet de données le soin d’en créer un pour vous.
  12. Dans la zone Champs de la page de détails, sélectionnez les colonnes à afficher dans la page de détails.

    Par défaut, toutes les colonnes du jeu d’enregistrements de la page principale sont sélectionnées. Si le jeu d’enregistrements contient une colonne clé unique, telle que recordID, sélectionnez-la, puis cliquez sur le bouton Moins (-) afin qu’elle ne s’affiche pas dans la page d’informations détaillées.

  13. Pour modifier l’ordre d’apparition des colonnes dans la page de détails, sélectionnez une colonne dans la liste, puis cliquez sur la flèche vers le bas ou vers le haut.

    Dans la page de détails, les colonnes du jeu d’enregistrements sont disposées verticalement dans un tableau. Un clic sur la flèche vers le haut déplace la colonne vers le haut ; un clic sur la flèche vers le bas déplace la colonne vers le bas.

  14. Cliquez sur OK.

    L’objet de données crée une page de détails (si vous ne l’avez déjà fait) et ajoute un contenu de page dynamique ainsi que des comportements de serveur à la page principale et à la page de détails.

  15. Personnalisez la mise en forme de la page principale et de la page de détails en fonction de vos besoins.

    Vous pouvez personnaliser la mise en forme de chaque page à l’aide des outils de conception de page de Dreamweaver. Vous pouvez également modifier les comportements de serveur en double-cliquant dessus dans le panneau Comportements de serveur.

    Après avoir créé l’ensemble de pages principales et de détails à l’aide de l’objet de données, utilisez le panneau Comportements de serveur (Fenêtre > Comportements de serveur) pour modifier les divers éléments que l’objet de données insère dans les pages.

Recevez de l’aide plus rapidement et plus facilement

Nouvel utilisateur ?