J'ai remarqué que, lorsque je crée des applications web, je passe la plus grande partie de mon temps à créer des formulaires, la mise en page et l'interface utilisateur. Je ne sais pas ce que vous préférez mais moi, je préfère programmer la logique et les fonctionnalités, pas l'apparence. Tous mes formulaires commençaient de la même façon : un tableau sur deux colonnes avec l'étiquette dans la colonne de gauche d'une largeur de 150 pixels et un champ dans la colonne de droite. En gros, un formulaire de base comme vous en avez certainement déjà créé. Il me semblait toujours fastidieux de devoir rédiger le même tableau à maintes reprises. Et je n'avais besoin que d'une dizaine d'éléments, pas des 200 à 300 lignes de code HTML qui les englobaient.
Nous en avons donc conclu que les développeurs pouvaient bénéficier de gestionnaires de mise en page comme dans d'autres langages, pour les applications Java Swing, par exemple. Le problème ? Le web et le langage HTML n'ont pas de gestionnaires de mise en page, ils utilisent des tableaux, des balises div et des balises spans avec un positionnement relatif ou absolu, rien d'automatique en ce qui concerne la mise en page.
Heureusement, nous avons profité d'un concours de circonstances. Premièrement, l'équipe Macromedia Flex travaillait à la conception de gestionnaires de mise en page pour les formulaires Flash dans Flex. Deuxièmement, Flex est basé sur le langage XML. Nous souhaitions depuis longtemps donner la possibilité de créer des contenus dans ColdFusion et fournir la puissance des formulaires dynamiques rendus possibles par des composants Flash. Flex nous a permis de nous rendre compte que notre prototype de formulaires XML – basés sur le schéma XForms – correspondrait très facilement au langage MXML (le langage de Flex) dont nous avions besoin pour Flex. Cette relation nous a permis d'exposer la même syntaxe CFML pour les gestionnaires de mise en page dans les formulaires XML et Flash.
Quel est l'intérêt de ces gestionnaires de mise en page ? Tout simplement qu'ils simplifient le développement des formulaires et vous permettent de passer plus de temps sur les fonctionnalités de vos applications plutôt que sur leur mise en page.
Même si ColdFusion MX 7 transfert la tâche de gestion de la mise en page à des gestionnaires de mise en page, la création de formulaires n'est pas encore une opération à 100 % automatique. Le nombre de façons différentes de réaliser la mise en page d'un formulaire est tout simplement trop important. Un moteur ne peut pas deviner le résultat attendu et peut conduire au fonctionnement incorrect d'une application.
La clé est de trouver une solution convenant à tous. Cette solution doit réduire la quantité de code nécessaire à la mise en page d'un formulaire tout en permettant aux développeurs de définir des éléments de base de la mise en page. C'est pour cela que nous avons ajouté une nouvelle balise à ColdFusion, la balise cfformgroup. Cette nouvelle balise est utilisée pour « guider » les gestionnaires de mise en page.
Les gestionnaires de mise en page utilisent un certain nombre de règles pour définir la mise en page, telles que largeur définie, largeur minimum des composants, taille du formulaire, espace libre, dimensions des étiquettes, etc. Ces règles font que les groupes ne fournissent que des « conseils » au lieu de règles obligatoires. Les gestionnaires de mise en page essaient de faire ce qui est spécifié par le groupe mais, si les champs ne tiennent pas, les gestionnaires les placent dans un format différent de ce que vous avez défini.
Par exemple, si vous créez un groupe à l'aide de l'attribut type="horizontal" alors que le groupe contient 10 éléments de formulaire, il est quasiment certain que 10 champs les uns à côté des autres prendra plus de place que l'espace défini. Le cas échéant, le gestionnaire de mise en page fait de son mieux. Le résultat le plus probable est qu'il placera trois ou quatre champs sur une première ligne, plus trois ou quatre autres sur la ligne suivante, et ainsi de suite.
C'est là un résultat différent de celui obtenu avec les tableaux HTML « traditionnels » dans lesquels chaque champ est placé dans sa propre cellule. Lorsque les gestionnaires de mise en page produisent un résultat inattendu dans ColdFusion MX 7, il vous faut régler la largeur des éléments, généralement en la réduisant. Si cela ne donne pas le résultat escompté, augmentez la largeur du formulaire ou supprimez les étiquettes des différents éléments pour les remplacer par des étiquettes de groupe. L'exemple suivant présente comment utiliser la balise cfformgroup pour placer les champs prénom et nom l'un à côté de l'autre, avec une étiquette commune :
<cfformgroup type="horizontal" label="Nom :">
<cfinput type="text" name="prénom" value="">
<cfinput type="text" name="nom" value="">
</cfformgroup>
