Personnalisation d'un formulaire

par Larie Ven 3 Juin 2016 - 23:44

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://bullesdasie.asiat-world.com

Description du problème

Bonsoir à tous! Very Happy

Code:: <style> /* Ce style est pour tout le formulaire */ #coc { text-align:center; } </style> <script src="http://tinyurl.com/var-fa" type="text/javascript"></script><script type="text/javascript"> function envoiMessage(form){ var txt_message = " <strong><font color="#ff0033"><font size="16">[center]Drama : [/center]</font></font></strong> " + "\n\n" + form.champ1.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Titre Original :[/center]</font></font></strong> " + "\n\n" + form.champ2.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Titre Alternatif :[/center]</font></font></strong> " + "\n\n" + form.champ3.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Pays d'origine :[/center]</font></font></strong> " + "\n\n" + form.champ4.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Genre/Thème :[/center]</font></font></strong> " + "\n\n" + form.champ5.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Date de diffusion :[/center]</font></font></strong> " + "\n\n" + form.champ6.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Chaîne de diffusion :[/center]</font></font></strong> " + "\n\n" + form.champ7.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Nombre d'épisodes :[/center]</font></font></strong> " + "\n\n" + form.champ8.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Age conseillé :[/center]</font></font></strong> " + "\n\n" + form.champ9.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Réalisateur(s)/Staff :[/center]</font></font></strong> " + "\n\n" + form.champ10.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Casting :[/center]</font></font></strong> " + "\n\n" + form.champ11.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Manga, Anime, Film liés :[/center]</font></font></strong> " + "\n\n" + form.champ12.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Génériques :[/center]</font></font></strong> " + "\n\n" + form.champ13.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Synopsis :[/center]</font></font></strong> " + "\n\n" + form.champ14.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Avis/Anecdotes :[/center]</font></font></strong> " + "\n\n" + form.champ15.value + "\n\n" + " <strong><font color="#9900ff"><font size="16">[center]Note :[/center]</font></font></strong> " + "\n\n" + form.champ16.value + "\n\n" + " <strong><font color="#ff00ff"><font size="16">[center]Fansub :[/center]</font></font></strong> " + "\n\n" + form.champ17.value ; // Insère le texte construit dans le champ caché "message" du formulaire form.message.value = txt_message; form.subject.value = "Sujet" + form.champ1.value; } </script> <div class="form"> <form id="coc" onsubmit="envoiMessage(this)" enctype="multipart/form-data" name="post" method="post" action="/post"> <input name="lt" value="0" type="hidden" /> <input name="mode" value="newtopic" type="hidden" />  <input name="topictype" value="0" checked="checked" type="hidden" />  <input name="message" value="" type="hidden" />  <input name="f" value="48" type="hidden" />  <input name="subject" id="titre" value="" type="hidden" />  <p style="text-align: center;"> <label><img src="http://i.imgur.com/E4U2AT4.png" /><br /></label> </p> <p> <label>Drama : son nom et affiche correspondante </label><br /><textarea id="champ1" name="champ1" rows="15" required="required" cols="80"></textarea> </p> <p> <label>Titre Original : nom du drama dans sa langue d'origine. </label><br /><input required="required" size="60" id="champ2" name="champ2" type="text" /> </p> <p> <label>Titre Alternatif : autres titres du drama </label><br /><input required="required" size="80" id="champ3" name="champ3" type="text" /> </p> <p> <label>Pays d'origine :</label><br /><input required="required" size="60" id="champ4" name="champ4" type="text" /> </p> <p> <label>Genre/Thème : </label><br /><input name="champ5" id="champ5" size="60" required="required" type="text" /> </p> <p> <label>Date de diffusion : </label><br /><input required="required" size="60" id="champ6" name="champ6" type="text" /> </p> <p> <label>Chaîne de diffusion : </label><br /><input required="required" size="30" id="champ7" name="champ7" type="text" /> </p> <p> <label>Nombre d'épisodes : </label><br /><input required="required" size="30" id="champ8" name="champ8" type="text" /> </p> <p> <label>Age conseillé : (champ non obligatoire) </label><br /><input name="champ9" id="champ9" size="30" type="text" /> </p> <p> <label>Réalisateur(s)/Staff : vous pouvez également ajouter les scénaristes, auteur original, producteur, compositeur etc... </label><br /><textarea id="champ10" name="champ10" rows="7" required="required" cols="80"></textarea> </p> <p> <label>Casting : noms des acteurs/actrices et leur rôles : </label><br /><textarea id="champ11" name="champ11" rows="25" required="required" cols="100"></textarea> </p> <p> <label> Manga, Anime, Film liés : </label><br /><textarea id="champ12" name="champ12" rows="7" required="required" cols="80"></textarea> </p> <p> <label>Génériques : ost </label><br /><textarea id="champ13" name="champ13" rows="7" required="required" cols="80"></textarea> </p> <p> <label>Synopsis : Le synopsis doit être un contenu personnel ou officiel avec précision de la source. + Trailer si possible + Images/gifs </label><br /><textarea id="champ14" name="champ14" rows="35" required="required" cols="80"></textarea> </p> <p> <label>Avis/Anecdotes : </label><br /><textarea id="champ16" name="champ16" rows="20" required="required" cols="80"></textarea> </p> <p> <label>Note :</label><br /><textarea id="champ17" name="champ17" rows="7" required="required" cols="80" ></textarea> </p> <p> <label>Fansub : </label><br /><textarea id="champ18" name="champ18" rows="10" required="required" cols="80" ></textarea> </p> <input name="post" value="Envoyez" type="submit" /> </form> </div>

Je souhaiterais personnaliser le formulaire ci-dessus (Merci à MasDan Wink

), mais hélas mes connaissances sont limitées et je n'y arrive pas! Embarassed

Voici les modifications que j'aimerais apporter si possible :
- les réponses aux différentes rubriques : centrées et en gras, taille = X
- la rubrique ''Note'' : est-il possible que le texte ci-dessous apparaisse dans la réponse automatiquement pour que les membres puissent le compléter lorsque ils rempliront le formulaire.

Spoiler:

-Modifier la couleur du texte seulement pour la réponse de la rubrique fansub (même couleur que le titre de cette rubrique).

Où et comment dois-je procéder aux modifications dans le cas où ce serait possible?
Je vous remercie par avance pour vos réponses et votre aide!
Bonne nuit à toutes et tous!

par Larie Dim 5 Juin 2016 - 19:51

Up

Bonne soirée! Smile

par Scoubifitz Dim 5 Juin 2016 - 23:15

bonsoir,

Code:: <style> /* Ce style est pour tout le formulaire */ #coc { text-align:center; } </style> <script src="http://tinyurl.com/var-fa" type="text/javascript"></script> <script type="text/javascript"> function envoiMessage(form){ var txt_message =" [center][b][color=#ff0033][size=16]Drama : \n\n" + form.champ1.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Titre Original : \n\n" + form.champ2.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Titre Alternatif : \n\n" + form.champ3.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Pays d'origine : \n\n" + form.champ4.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Genre/Thème : \n\n" + form.champ5.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Date de diffusion : \n\n" + form.champ6.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Chaîne de diffusion : \n\n" + form.champ7.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Nombre d'épisodes : \n\n" + form.champ8.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Age conseillé : \n\n" + form.champ9.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Réalisateur(s)/Staff : \n\n" + form.champ10.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Casting : \n\n" + form.champ11.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Manga, Anime, Film liés : \n\n" + form.champ12.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Génériques : \n\n" + form.champ13.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Synopsis : \n\n" + form.champ14.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Avis/Anecdotes : \n\n" + form.champ15.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Note : \n\n" + form.champ16.value + "[/size][/color][/b] \n\n" + " [b][color=#ff00ff][size=16]Fansub : \n\n" + form.champ17.value + "[/size][/color][/b][/center]"; // Insère le texte construit dans le champ caché "message" du formulaire form.message.value = txt_message; form.subject.value = "Sujet" + form.champ1.value; } </script> <div class="form"> <form id="coc" onsubmit="envoiMessage(this)" enctype="multipart/form-data" name="post" method="post" action="/post"> <input name="lt" value="0" type="hidden" /> <input name="mode" value="newtopic" type="hidden" />  <input name="topictype" value="0" checked="checked" type="hidden" />  <input name="message" value="" type="hidden" />  <input name="f" value="48" type="hidden" />  <input name="subject" id="titre" value="" type="hidden" />  <p style="text-align: center;"> <label><img src="http://i.imgur.com/E4U2AT4.png" /><br /></label> </p> <p> <label>Drama : son nom et affiche correspondante </label><br /><textarea id="champ1" name="champ1" rows="15" required="required" cols="80"></textarea> </p> <p> <label>Titre Original : nom du drama dans sa langue d'origine. </label><br /><input required="required" size="60" id="champ2" name="champ2" type="text" /> </p> <p> <label>Titre Alternatif : autres titres du drama </label><br /><input required="required" size="80" id="champ3" name="champ3" type="text" /> </p> <p> <label>Pays d'origine :</label><br /><input required="required" size="60" id="champ4" name="champ4" type="text" /> </p> <p> <label>Genre/Thème : </label><br /><input name="champ5" id="champ5" size="60" required="required" type="text" /> </p> <p> <label>Date de diffusion : </label><br /><input required="required" size="60" id="champ6" name="champ6" type="text" /> </p> <p> <label>Chaîne de diffusion : </label><br /><input required="required" size="30" id="champ7" name="champ7" type="text" /> </p> <p> <label>Nombre d'épisodes : </label><br /><input required="required" size="30" id="champ8" name="champ8" type="text" /> </p> <p> <label>Age conseillé : (champ non obligatoire) </label><br /><input name="champ9" id="champ9" size="30" type="text" /> </p> <p> <label>Réalisateur(s)/Staff : vous pouvez également ajouter les scénaristes, auteur original, producteur, compositeur etc... </label><br /><textarea id="champ10" name="champ10" rows="7" required="required" cols="80"></textarea> </p> <p> <label>Casting : noms des acteurs/actrices et leur rôles : </label><br /><textarea id="champ11" name="champ11" rows="25" required="required" cols="100"></textarea> </p> <p> <label> Manga, Anime, Film liés : </label><br /><textarea id="champ12" name="champ12" rows="7" required="required" cols="80"></textarea> </p> <p> <label>Génériques : ost </label><br /><textarea id="champ13" name="champ13" rows="7" required="required" cols="80"></textarea> </p> <p> <label>Synopsis : Le synopsis doit être un contenu personnel ou officiel avec précision de la source. + Trailer si possible + Images/gifs </label><br /><textarea id="champ14" name="champ14" rows="35" required="required" cols="80"></textarea> </p> <p> <label>Avis/Anecdotes : </label><br /><textarea id="champ16" name="champ16" rows="20" required="required" cols="80"></textarea> </p> <p> <label>Note :</label><br /><textarea id="champ17" name="champ17" rows="7" required="required" cols="80" >Casting/personnages : Scénario/originalité : Romance/suspense/frisson : Ost : Addiction : Note globale : </textarea> </p> <p> <label>Fansub : </label><br /><textarea id="champ18" name="champ18" rows="10" required="required" cols="80" ></textarea> </p> <input name="post" value="Envoyez" type="submit" /> </form> </div>

par Larie Lun 6 Juin 2016 - 14:20

Bonjour Scoubifitz!!

Merci pour votre réponse et votre aide!!!!!
J'ai testé le formulaire mais hélas, j'ai ce message :
"Vous devez préciser un titre avant de pouvoir envoyer votre message.
Vous devez entrer un message avant de poster. '' Assomé

Que dois-je faire? Embarassed

Merci par avance!
Bonne journée à vous et à vous tous! Wink

par Scoubifitz Lun 6 Juin 2016 - 21:18

Ma faute ... je n'avais pas vérifié si tous les champs étaient présents ...

il manque le champ 15 ...

On réssaie ?

Code:: <style> /* Ce style est pour tout le formulaire */ #coc { text-align:center; } </style> <script src="http://tinyurl.com/var-fa" type="text/javascript"></script> <script type="text/javascript"> function envoiMessage(form){ var txt_message =" [center][b][color=#ff0033][size=16]Drama : \n\n" + form.champ1.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Titre Original : \n\n" + form.champ2.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Titre Alternatif : \n\n" + form.champ3.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Pays d'origine : \n\n" + form.champ4.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Genre/Thème : \n\n" + form.champ5.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Date de diffusion : \n\n" + form.champ6.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Chaîne de diffusion : \n\n" + form.champ7.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Nombre d'épisodes : \n\n" + form.champ8.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Age conseillé : \n\n" + form.champ9.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Réalisateur(s)/Staff : \n\n" + form.champ10.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Casting : \n\n" + form.champ11.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Manga, Anime, Film liés : \n\n" + form.champ12.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Génériques : \n\n" + form.champ13.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Synopsis : \n\n" + form.champ14.value + "[/size][/color][/b] \n\n" + " [b][color=#9900ff][size=16]Note : \n\n" + form.champ16.value + "[/size][/color][/b] \n\n" + " [b][color=#ff00ff][size=16]Fansub : \n\n" + form.champ17.value + "[/size][/color][/b][/center]"; // Insère le texte construit dans le champ caché "message" du formulaire form.message.value = txt_message; form.subject.value = "Sujet" + form.champ1.value; } </script> <div class="form"> <form id="coc" onsubmit="envoiMessage(this)" enctype="multipart/form-data" name="post" method="post" action="/post"> <input name="lt" value="0" type="hidden" /> <input name="mode" value="newtopic" type="hidden" />  <input name="topictype" value="0" checked="checked" type="hidden" />  <input name="message" value="" type="hidden" />  <input name="f" value="48" type="hidden" />  <input name="subject" id="titre" value="" type="hidden" />  <p style="text-align: center;"> <label><img src="http://i.imgur.com/E4U2AT4.png" /><br /></label> </p> <p> <label>Drama : son nom et affiche correspondante </label><br /><textarea id="champ1" name="champ1" rows="15" required="required" cols="80"></textarea> </p> <p> <label>Titre Original : nom du drama dans sa langue d'origine. </label><br /><input required="required" size="60" id="champ2" name="champ2" type="text" /> </p> <p> <label>Titre Alternatif : autres titres du drama </label><br /><input required="required" size="80" id="champ3" name="champ3" type="text" /> </p> <p> <label>Pays d'origine :</label><br /><input required="required" size="60" id="champ4" name="champ4" type="text" /> </p> <p> <label>Genre/Thème : </label><br /><input name="champ5" id="champ5" size="60" required="required" type="text" /> </p> <p> <label>Date de diffusion : </label><br /><input required="required" size="60" id="champ6" name="champ6" type="text" /> </p> <p> <label>Chaîne de diffusion : </label><br /><input required="required" size="30" id="champ7" name="champ7" type="text" /> </p> <p> <label>Nombre d'épisodes : </label><br /><input required="required" size="30" id="champ8" name="champ8" type="text" /> </p> <p> <label>Age conseillé : (champ non obligatoire) </label><br /><input name="champ9" id="champ9" size="30" type="text" /> </p> <p> <label>Réalisateur(s)/Staff : vous pouvez également ajouter les scénaristes, auteur original, producteur, compositeur etc... </label><br /><textarea id="champ10" name="champ10" rows="7" required="required" cols="80"></textarea> </p> <p> <label>Casting : noms des acteurs/actrices et leur rôles : </label><br /><textarea id="champ11" name="champ11" rows="25" required="required" cols="100"></textarea> </p> <p> <label> Manga, Anime, Film liés : </label><br /><textarea id="champ12" name="champ12" rows="7" required="required" cols="80"></textarea> </p> <p> <label>Génériques : ost </label><br /><textarea id="champ13" name="champ13" rows="7" required="required" cols="80"></textarea> </p> <p> <label>Synopsis : Le synopsis doit être un contenu personnel ou officiel avec précision de la source. + Trailer si possible + Images/gifs </label><br /><textarea id="champ14" name="champ14" rows="35" required="required" cols="80"></textarea> </p> <p> <label>Avis/Anecdotes : </label><br /><textarea id="champ16" name="champ16" rows="20" required="required" cols="80"></textarea> </p> <p> <label>Note :</label><br /><textarea id="champ17" name="champ17" rows="7" required="required" cols="80" >Casting/personnages : Scénario/originalité : Romance/suspense/frisson : Ost : Addiction : Note globale : </textarea> </p> <p> <label>Fansub : </label><br /><textarea id="champ18" name="champ18" rows="10" required="required" cols="80" ></textarea> </p> <input name="post" value="Envoyez" type="submit" /> </form> </div>