| << Fonctionnement général |
Sommaire |
Nous allons maintenant aborder la création d'un formulaire. La démarche est relativement simple et une aide au coeur même du paramétrage vous permet de vous aider de façon rapide. Toutefois un nombre de précisions considérables sont apportées tout au long de cette notice. merci donc de concilier les deux afin de prendre en main au mieux le composant. Un formulaire se crée en 3 étapes :
- Création et paramétrage du formulaire
- Génération de la table
- Création des champs liés au formulaire
Voici la barre de menu que vous trouvez dans la section gestion des formulaires. Cette barre est assez simple de compréhension, mais mérite toute votre attention car elle pourra vous aider avec quelques fonctionnalités que vous ne soupçonnez pas:
- Nouveau vous permet de créer un nouveau formulaire
- Editer vous permet de modifier un formulaire existant
- Copier vous permet de copier un formulaire complet avec sa table et ses champs
- Supprimer supprime juste le formulaire mais conserve les champs et la table
- Définitif supprime complètement le formulaire, y compris ses champs et la table de stockage. Si vous utilisez cette option, attention d'être sûr de vous, car il n'y a aucun recours possible pour récupérer le formulaire et les données après.
- Reconstruire vous permet d'optimiser et réparer les tables au sens de MYSQL, mais également de mettre à jour tous les formulaires, et de supprimer les entrées ACL supprimées de la table ACL mais toujours existante dans votre formulaire.
- Publier vous permet de publier un ou plusieurs formulaires en même temps
- Dépublier vous permet de dépublier un ou plusieurs formulaires en même temps
- Paramètres vous permet définir les options générales e l'ensemble du composant composant
Configuration générale
La configuration générale est la partie la plus importante du formulaire. C'est elle qui détermine l'ensemble du formulaire, son identité, son existence, sa table, sa publication. Au travers d'une mise en page simple il vous est demandé de compléter et déterminer :
- le nom du formulaire
- la description du formulaire
Celle ci est affichée dans la mise en page si vous le paramétré. Elle peut contenir du code HTML ainsi que les les variables QuickForm.
- les accès aux formulaires
Ceux ci sont attribués en fonction d'une liste de groupes d'utilisateurs. Pour sélectionner plusieurs groupe, maintenez la touche ctrl enfoncée et cliquez sur les accès souhaités.
- la publication du formulaire
- une date et horaire de début
Le formulaire ne s'affiche pas tant que la date n'est pas atteinte. Laisser vide si vous ne voulez pas donner de limite de début.
- une date et horaire de fin
Le formulaire ne s'affiche plus une fois la date dépassée. Laisser vide si vous ne voulez pas donner de limite de fin.
- une table mysql
Cette option n'apparait que lors de la création et vous donne le choix entre créer une nouvelle table ou utiliser une ancienne table non affectée(orpheline).
Redirection et message de succès après soumission
A la fin de l'enregistrement des données par un utilisateurs, vous aurez très certainement envie d'afficher un message de succès d'enregistrement des données, ou bien de rediriger automatiquement l'utilisateur vers une page de votre choix. Pour se faire, vous devez vous rendre dans Message de remerciement ou vous pourrez déterminer :
- une redirection automatique
- un lien vers lequel sera redirigé l'utilisateur. Automatiquement, si vous avez mis oui précédemment, ou manuellement en cliquant sur Terminer, si vous avez mis non. A noter que ce lien peut contenir des variables QuickForm.
Exempleindex.php?option=com_quickform&view=quickdetails&forms=1&tod=1&rel={id:value}Redirige vers une page d'affichage : forms=1 détaillée : tod=1 qui contient les données soumises : rel={id:value}
- un message de félicitations. Ce message peut être au format texte, HTML et contenir les variables QuickForm afin d'afficher les résultats soumis précédemment ou encore l'identité de l'utilisateur connecté ayant soumis les données.
Exemple (Texte par défaut)<b>Merci à vous {$my->name} {$my->username},</b> Vos données ont bien été enregistrées. Un email de confirmation vous a également été envoyé. Merci de ne pas y répondre. Pour saisir de nouvelles données, cliquez sur continuer, sinon sur terminer.Envoi de mail lors de la soumission
Une fois les données enregistrées, vous avez la possibilités d'envoyer deux emails différents à une ou plusieurs adresse de votre choix. Il est important de noter que chacun des champs de paramétrage peut accueillir les variables QuickForm, permettant ainsi de récupérer des données venant d'être saisie par l'utilisateur. Le paramétrage de ces deux emails est identique et définis comme suit :
- De la part de . Adresse de l'expéditeur.
Exemple (Depuis un champ votreadresse du formulaire){votreadresse:value}
- Nom. Nom visible de l'expéditeur, généralement le nom du site.
- Envoyer à. Liste d'adresses séparées pat des ','. Cette liste peut contenir aussi bien une adresse pré établie, qu'une adresse déterminée depuis un champ du formulaire.
Exemple n°1 - Adresse uniquequickform@quickform.frExemple n°2 - Depuis un champ votreadresse du formulaire
{votreadresse:value}Exemple n°3 - Liste d'adresses
quickform@quickform.fr,{votreadresse:value},noreply@quickform.fr
- Objet. Objet du message.
- Type. Détermine si le mail est enovoyé au format HTML ou en Texte brut.
- Message. Contenu de l'email, il peut être en code HTML ou en simple texte et peut contenir les variables QuickForm.
- Joindre fichier. Détermine l'attachement des fichiers uploadés.
- Mode d'envoi du mail. Vous permet de choisir le moyen technique utilisé pour envoyer le mail.
Personnalisation du code
Normalement si vous avez consulté le wiki dans l'ordre du sommaire, vous avez déjà pris connaissance des méthodes de personnalisations du code. Me rafraichir la mémoire
Mise en page
La mise en page du formulaire avec QuickForm est une chose relativement simple, quelque soit votre niveau de connaissance et d'utilisation. On pourrait classer en 3 niveaux la possibilité de faire une mise en page avec QuickForm.
- Niveau 1 C'est le mode ligne par ligne. Destiné aux utilisateurs débutants ou souhaitant mise en page rapide, ce niveau vous propose une mise en page par défaut 100% compatible avec toutes les options QuickForm, Vous pouvez très bien créer un article avec le wyswyg et y insérer les tag {cat}, {formtitle}, {desc} et {fields}. Les lignes, misent en page dans chaque champ, seront associées et misent en remplacement du tag {fields}.
Dans formulaire : (Par défaut)<div class="componentheading">{cat}, {formtitle}</div> <div>{desc}</div> <div>{fields}</div>Pour chaque champ : (exemple avec le code HTML par défaut dans Mise en page de la ligne)
<div> <span class="editlinktip hasTip" title="{caption}::{desc}" /> <div style="width:49%; float:left;">{caption} {req}</div> <div style="width:50%; position:relative; float:left;">{body}</div> <div class="clr">{error}</div> </div>
- Niveau 2 Le mode mise en page aidé. Vous avez la possibilité de définir l'emplacement de chaque champs en fonction de leur noms en faisant votre mise en page complète dans le wyswiwyg cette fois.
Exemple<div class="componentheading">{cat}, {formtitle}</div> <div>{desc}</div> <div> <div> <span class="editlinktip hasTip" title="{prenom:caption}::{prenom:desc}" /> <div style="width:49%; float:left;">{prenom:caption} {prenom:req}</div> <div style="width:50%; position:relative; float:left;">{prenom:body}</div> <div class="clr">{prenom:error}</div> </div> <div> <span class="editlinktip hasTip" title="{nom:caption}::{nom:desc}" /> <div style="width:49%; float:left;">{nom:caption} {nom:req}</div> <div style="width:50%; position:relative; float:left;">{nom:body}</div> <div class="clr">{nom:error}</div> </div> </div>
- Niveau 3 Le mode je m'occupe de tout. Vous créez votre mise en page dans un éditeur HTML et vous insérez le contenu dans le wysiyg en mettant bien les noms de champ sous la forme : QF[nomduchamp] et autre standards HTML
<input type="text" value="" size="0" name="QF[monpremierchamps]" id="monpremierchamps" style="width:100%;" maxlength="255" /> <input type="text" value="" size="0" name="QF[adressemail]" id="adressemail" style="width:100%;" maxlength="255" /> <input type="submit" value="Soumettre" name="QF[soumettre]" id="soumettre" style="width:100%"/>
Après avoir enregistré un formulaire en utilisant la méthode Sauvegarder, vous revenez automatiquement sur la page principale qui liste les formulaires et affiche leur état. A ce stade, vous devriez avoir quelque chose à l'écran qui ressemble à cela :
La croix rouge signifie, en réalité, que la table n'existe pas, de ce fait vous n'avez pas accès aux champs. Afin d'initialiser la table, il vous suffit juste de cliquer sur la croix pour mettre à jour tout les formulaires en attente de création de table. Vous obtiendrai donc normalement à la fin ceci :
| Gestion des champs >> |