Forums Développement Multimédia

Les formations Mediabox
Les formations Mediabox

Comment faire du dynamique dans Dreamweaver MX

Compatible Dreamweaver MX. Cliquer pour en savoir plus sur les compatibilités.Compatible PHP. Cliquer pour en savoir plus sur les compatibilités.Le 12 août 2005

Voici un petit tutorial pour comprendre comment aborder l'aspect dynamique de Dreamweaver MX. Vous constaterez ainsi que c' est assez simple. Pour commencer, nous allons construire un modèle de news.

Matériel requis : EasyPHP et Dreamweaver MX

1 - Tout d' abord, nous allons créer les bases de données. Dans EasyPHP, lancez PHPmyadmin.

2 - Sur la première page, il vous est proposé de créer une base de donnée. Je l'ai nommée newsDream, mais si vous avez déjà une base prête, utilisez celle-ci et continuez.

3 - Créez une nouvelle table, je l'ai nommée news, et précisez qu 'elle contient 4 champs. Ces champs seront la date, le titre, un résumé et le texte complet. Pour simplifier, voici le code SQL de la création de la table :

CREATE TABLE `news` (`date` DATE not null, `titre` VARCHAR(50) not null, `resume` VARCHAR(150) not null, `texte` MEDIUMBLOB not null )

Vous pouvez ainsi copier / coller ce code.

4 - Remplissez la table à convenance afin de pouvoir afficher quelque chose lors des requêtes. Attention : le format de la date est AAAA-MM-JJ !

5 - Créez un dossier dans le dossier www d'EasyPHP, je l' ai nommé newsDream.

6 - Ouvrez Dreamweaver si ce n' est pas encore fait, faites Site > Nouveau Site.

7 - Choisissez l'onglet avancé. Remplissez le nom du site. Pour le dossier racine local, précisez l' emplacement du dossier que vous venez de créer. Le mien est : C:\Program Files\EasyPHP\www\newsDream\

8 - Pour Infos Distantes, choisissez Local/Réseau pour l'accès et le même dossier qu' avant pour le répertoire distant.

9 - Dans serveur d' évaluation, prenez PHP MySQL pour modèle de serveur, Local/Réseau pour accès et toujours le même dossier comme serveur d'évaluation. Le préfixe de l' url sera http://localhost/newsDream/ Cliquez sur OK pour terminer.

10 - Créez un fichier nommé index.php dans ce nouveau site, enregistrez le tout de suite (il apparaît dans la palette Fichier - Site).

11 - Ouvrez la palette Application et cliquez sur l'onglet Comportements de serveur. Normalement, les 3 premiers points sur 4 sont cochés. Si ce n' est pas le cas, modifiez votre site. Cliquez sur le bouton (+) pour créer un jeu d' enregistrements.

12 - Définissez le nom de ce jeu d' enregistrement, par exemple news. Normalement, aucun paramètre de connexion n'est paramètré, nous allons donc le faire en cliquant sur Définir.

13 - Dans la boite de dialogue qui s' ouvre, cliquez sur nouveau. Définissez un nom, par exemple cnx, précisez le serveur de connexion MySQL (ici localhost), le nom d' utilisateur (par défaut root), le mot de passe (ne remplissez rien si vous ne savez pas), et sélectionnez votre base de donnée avec le bouton Sélectionner… puis cliquez sur Tester pour tester. Si tout fonctionne, cliquez sur OK. Puis sur terminer de la boite précédente.

14 - Dans les colonnes, vous pouvez choisir les valeurs à afficher. Ici, on peut garder toutes les valeurs.

15 - Vous pouvez filtrer ou trier les résultats. Ici par exemple, nous allons trier par date en choisissant Décroissant. Si vous êtes déjà initiés à SQL, vous pouvez cliquer sur le bouton avancé pour ajouter des options. Cliquez sur tester pour vérifier que ça fonctionne. Si vos news s'affichent, tout va bien, cliquez sur OK pour continuer.

16 - Vous pouvez vérifier que Dreamweaver a créé dans votre dossier un dossier Connections contenant le fichier de connexion et que votre jeu d' enregistrement s'affiche dans la palette Application.

17 - Dans la palette insertion, cliquez sur l'onglet Application et ensuite sur tableau dynamique.

18 - Normalement, vous n' avez qu' un seul jeu d' enregistrement, sinon choisissez celui que vous voulez afficher. Vous pouvez choisir le nombre d' enregistrementà afficher et 3 options concernant le tableau qui va être créé. Cliquez sur OK quand vous avez terminé.

19 - Cliquez sur affichage Dynamique des données ou faites F12 si EasyPHP tourne toujours. Constatez que vos news s' affichent. Il ne vous reste plus qu 'à les mettre en page.

20 - Pour améliorer un peu tout ça, il vous faudrait la possibilité de mettre à jour ces news facilement ? Nous allons alors créer une interface simple de mise à jour. Pour cela créez un nouveau fichier et enregistrez le dans le même dossier (nommez le par exemple maj.php)

21 - Créez un formulaire avec 4 champs. Ensuite cliquez sur (+) de la palette Application - Comportement de serveur puis Insérer un nouvel enregistrement.

22 - Dans la boite de dialogue, choisissez le nom du formulaire créé, la connexion définie dans la première partie du tutorial et la table news. Sélectionnez date dans Colonnes et faites lui correspondre un champ texte du formulaire. Par défaut, Dreamweaver repère le type de la valeur, donc laissez la valeur “Submit as” telle quelle. Recommencez pour les 3 autres valeurs. Choisissez enfin la page qui sera chargée après l' insertion. Choisissez par exemple index.php pour vérifier les changements. Cliquez sur OK pour terminer.

23 - Si tout s' est bien passé, en testant, ça devrait marcher. Alors, vous voyez que c' est pas compliqué !