Edité par OmniPilot Software, Lasso Professional fonctionne sous Windows 2000/2003/XP et Linux RedHat et Apache Server - Il s'intègre parfaitement à MySQL™ et FileMaker Pro™ ainsi que toutes autres bases de données
Article #: 262004638
Sujet:
Le truc de la semaine - Optimisez votre code HTML en utilisant les balises [Loop] et [Iterate]
Résumé:
Le Truc de la semaine pour le 6 Février 2004 discute des différentes techniques autour des balises [Loop] et [Iterate] pour vous éviter toutes redondances dans votre code HTML.
Détail:
La plupart d'entre-vous on développé des pages Web dont un aspect de la page est répété plusieurs fois. Il s'est agi d'un groupes de boutons pour la navigation, d'un groupe de champs input pour un formulaire, de lignes et de colonnes de tableaux, ou du design de la page elle-même. Il n'est pas difficile de trouver un grand nombre de codes HTML qui sont presques identiques à l'exception des mentions ou des valeurs qui y sont associées.
Lorsque vous créez vos pages en HTML, re-écrivant le même code encore et encore pour 50 inputs de formulaires avec leurs options, leurs listes de valeurs, ceci peut être particulièrement ennuyeux et vous prend en tout cas beaucoup de temps... sans compter le temps que cela vous prendra pour maintenir ce code lors de changement ultérieurs sur le site!
Heureusement, vous disposez d'un grand nombre de techniques pour "optimiser" votre code HTML avec Lasso. Ainsi vous obtiendrez le même résultat en utilisant le moins de code HTML que possible. De cette manière vous pourrez maintenir vos 50 champs de formulaires sur toutes les pages de votre sites, en modifiant uniquement une instance.
Les techniques que nous allons utiliser mettent en pratique les balises LDML conteneurs [Loop] ... [/Loop] et [Iterate] ... [/Iterate]. Pour ceux qui ne sont pas déjà familiers dans l'utilisation de ces balises, elles sont conçues pour répéter leur contenu sur des paramètres que vous définissez. La balise [Loop] répète son contenu un nombre de fois spécifié, tandis que la balise [Iterate] permet de "boucler" sur une variable de type array (liste) ou map (tableau) et répète leur contenu une seule fois pour chaque élément de cette variable.
La documentation en ligne pour ces variables est disponible à l'adresse suivante (informations en anglais):
Rappelez vous ces formulaires qui vous demandent d'entrer une date en sélectionnant le jour, le mois et l'année dans un jeu de menus pop-up. Pour un formulaire permettant d'entrer n'importe quelle date entre 1970 et 2035 devrait en principe entrer plus de 100 fois les balises HTML suivantes <option>...</option> !
Par l'utilisation des balises LDML [Loop] et [Date], nous pouvons optimiser le code HTML de telle manière que nous n'aurons qu'à écrire trois <option> au lieu de 100.
<select name="mois">
[loop: 12]
<option>[(date: -month=(loop_count))->(month: -long)]</option>
[/loop]
</select>
<select name="jour">
[loop: 31]
<option>[loop_count]</option>
[/loop]
</select>
<select name="annee">
[loop: 66]
<option>[1969 + (loop_count)]</option>
[/loop]
</select>
Le résultat est affiché ci-dessous:
Exemple de barre de navigation
Beaucoup de sites Web dispose d'une barre de menus. Il s'agit généralement d'un jeu de lien de navigation qui ont été designés d'une certaine manière à les rendre visible et distincts du reste de la page.
Au lieu d'écrire le même code HTML pour chaque lien du menu, il est possible d'écrire ce code pour un seul lien et de le ré-utiliser automatiquement pour tous les autres liens en utilisant la balise LDML [Iterate].
Dans cet exemple, nous allons d'abord créer une variable de type array (liste) qui contient tous les liens et leur nom pour notre barre de navigation. Nous utiliserons également un type de données de type pair pour chaque élément de la liste array, ce qui permettra de définir chaque nom de lien et son URL.
Notre variable array contient une donnée unique pour chaque lien, alors que le contenu à l'intérieur des balises [Iterate] ... [/Iterate] sera simplement le code HTML répété pour chaque élément du menu:
[var:'links'=(Array:
(Pair: 'Accueil'='/accueil.html'),
(Pair: 'News'='/News.html'),
(Pair: 'Produits'='/Produits.html'),
(Pair: 'Services'='/Service.html'),
(Pair: 'Liens'='/liens.html'))]
Notre dernier exemple montre comment des champs d'un formulaire peuvent être automatiquement générés depuis une liste de noms de champs d'une base de données.
Nous pouvons obtenir une liste des champs d'une base de données en utilisant la balise LDML [Inline] à l'aide du paramètre -Show. Il suffit ensuite de créer une variable dont la valeur prendra tous les noms des champs de la base dans une liste array à l'aide de la balise [Field_Names].
Cet exemple créee une liste des chamsp de saisie pour la table "people" dans la base "contacts" d'exemple fournit avec Lasso dans Lasso MySQL. (Note : l'utilisateur courant doit avoir la permission d'utiliser le paramètre -Show dans l'Administration Lasso à la fois pour la base "contacts" et pour la table "people" de manière à ce que cela fonctionne).
Pour plus d'informations sur les balises Lasso et les méthodologies décrites ici, veuillez consulter le guide du langage Lasso "Lasso Language Guide" (document Acrobat PDF inclut dans Lasso) ou la référence des balises LDML (http://ldml.blueworld.com).
Produits:
Lasso Professional, Lasso Studio for GoLive, Lasso Studio for Dreamweaver
Plateformes:
Mac OS X, Windows 2000, Windows XP, Windows 2003, Red Hat Linux
Administration du site webmaster@elidee.com | Copyright 2004-2010, Elidée SARL. Tous droits réservés
Toutes les marques citées sont déposées par leur propriétaire respectif
Accueil
