Problème avec mon formulaire

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Problème avec mon formulaire

Message par Mahora Dim 4 Juin 2017 - 2:26

Détails techniques


Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonjour,
Voilà, j'ai fait un formulaire qui fonctionne, mais le souci c'est que j'aurai aimé que les champs où il n'y a pas de réponse ne s'affiche pas si possible. Du genre le champs "votre avis", s'ils ne mettent rien je voudrais que cela n’apparaît pas dans le message une fois posté, mais il y en a d'autre en gros tous ceux qui ne sont pas obligatoire. Je ne sais pas si j'ai vraiment réussi à me faire comprendre, mais n'hésitez pas à demander si vous n'avez pas tout compris.
Je vous laisse mon formulaire, merci d'avance.
Code:

<!DOCTYPE html>
<html>
<head>
<link href='https://fonts.googleapis.com/css?family=Poiret+One|Shadows+Into+Light|PT+Sans+Narrow'
rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Josefin+Sans:400,400i,600,600i,700,700i" rel="stylesheet">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
  .backsm {
  background: none;
  background-position: center; 
  margin:auto;
}

.titresm {
  margin: auto;
  margin-top: 20px;
  margin-bottom: 30px;
  padding: 30px;
  width: 60%;
  text-align: center;
  color: #9e276d;
  font-family: 'Poiret One', cursive;
 font-size: 60px;
  text-shadow: 0px 0px 15px #be408a;
  line-height: 40px;
  border-top: 3px solid #9e276d;
  border-bottom: 3px solid #9e276d;
}

.cadre1sm {
 
  width: 675px;
  height: auto;
  background-color: none;
  background-color: none;
  border:1px solid #9e276d;
  vertical-align: middle;
}

.imgsm img {
  width: 250px;
  height: auto;
}
 
.imgsm {
   padding : 20px 20px 20px 20px;
  vertical-align: middle;
}

.presentationsm {
padding-left : 20px;
padding-right: 30px; 
font-family: 'Josefin Sans', sans-serif;
font-size: 15px;
color: 9e276d;
text-shadow: 0px 0px 3px #be408a;
vertical-align: middle;
height:100%;
}

.presentationsm p {
  margin:-9px;
}

.titreresumesm {
  margin: auto;
  margin-top: 20px;
  margin-bottom: 20px;
  padding: 20px;
  width: 40%;
  text-align: center;
  color: #9e276d;
font-family: 'Poiret One', cursive;
 font-size: 40px;
  text-shadow: 0px 0px 15px #be408a;
  border-bottom: 2px solid #9e276d;
}

.cadre2sm {
 
  width: 600px;
  height: auto;
  background-color: none;
  border:1px solid #9e276d;
}

.resumesm {
 padding: 20px 20px 20px 20px;
font-family: 'Josefin Sans', sans-serif;
font-size: 16px;
color: 9e276d;
text-shadow: 0px 0px 3px #be408a;
 text-align: justify;
}

.titreavissm {
  margin: auto;
  margin-top: 20px;
  margin-bottom: 20px;
  padding: 20px;
  width: 40%;
  text-align: center;
  color: #9e276d;
font-family: 'Poiret One', cursive;
 font-size: 40px;
  text-shadow: 0px 0px 15px #be408a;
  border-bottom: 2px solid #9e276d;
}

.avissm {
  padding: 20px 20px 20px 20px;
font-family: 'Josefin Sans', sans-serif;
font-size: 16px;
color: 9e276d;
text-shadow: 0px 0px 3px #be408a;
 text-align: justify;
}
</style>
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>
<script type="text/javascript">
function envoiMessage(form)
{
//le formulaire qui remplace la page de création de sujet habituelle
var txt_message = "<div class='backsm'>\n"
+ "<div class='titresm'>"+ form.titremangasm.value +"</div>\n"
+ "<center><table class='cadre1sm'>\n"
+ "<tr><td><div class='imgsm'><img src='"+ form.imgsm.value +"'/></div></td>\n"
+ "<td><div class='presentationsm'><p><b>♥ Titre original : </b>"+ form.titreorism.value +" </p>\n"
+ "<p><b>♥ Origine : </b>"+ form.originesm.value +" </p>\n"
+ "<p><b>♥ Année VF : </b>"+ form.anneevfsm.value +" </p>\n"
+ "<p><b>♥ Type : </b>"+ form.typesm.value +" </p>\n"
+ "<p><b>♥ Genres : </b>"+ form.genresm.value +" </p>\n"
+ "<p><b>♥ Auteur : </b>"+ form.auteursm.value +" </p>\n"
+ "<p><b>♥ Éditeur VO : </b>"+ form.editeurvosm.value +" </p>\n"
+ "<p><b>♥ Éditeur VF : </b>"+ form.editeurvfsm.value +" </p>\n"
+ "<p><b>♥ Prépublié dans : </b>"+ form.prepubliesm.value +" </p>\n"
+ "<p><b>♥ Nombre de volumes VO : </b>"+ form.nbvolvosm.value +" </p>\n"
+ "<p><b>♥ Nombre de volumes VF : </b>"+ form.nbvolvfsm.value +" </p>\n"
+ "<p><b>♥ Prix public : </b>"+ form.prixsm.value +" </p>\n"
+ "<p><b>♥ Âge conseillé : </b>"+ form.agesm.value +" </p>\n"
+ "<p><b>♥ Pour public averti : </b>"+ form.publicsm.value +" </p>\n"
+ "<p><b>♥ Se trouve dans le commerce en France : </b>"+ form.commercesm.value +" </p>\n"
+ "<p><b>♥ Existe en anime : </b>"+ form.adapanimesm.value +" </p>\n"
+ "</div></td></tr></table></center>\n"
+ "<div class='titreresumesm'>Résumé</div>\n"
+ "<center><div class='cadre2sm'>\n"
+ "<div class='resumesm'>"+ form.resumesm.value +" </div></div></center>\n"
+ "<div class='titreavissm'>Votre avis</div>\n"
+ "<center><div class='cadre2sm'>\n"
+ "<div class='avissm'>"+ form.avissm.value +" </div></div></center>\n"
+ "</div><br/>\n";
 
// Insère le texte construit dans le champ caché "message" du formulaire
form.message.value = txt_message;
}
</script>
</head>
<body>
<center>
<form action="/post" method="post" name="post" enctype="multipart/form-data" onSubmit="envoiMessage(this)">
<input type="hidden" name="lt" value="0" />
<input type="hidden" name="mode" value="newtopic" /> <!-- Un nouveau topic sera créé -->
<input type="hidden" name="topictype" value="0" checked="checked" /> <!-- Value 0: Sujet Normal (1 = post-it / 2 = annonce) -->
<input type="hidden" name="message" value="" /> <!-- Contiendra le texte du message -->
<input type="hidden" name="f" value="22" /> <!--  ID du forum dans lequel le message sera posté-->

<label for="titre">Titre du sujet : (Mettez le titre du manga)</label>
<input type="text" name="subject" id="titre" size="40"/>
  <br/><br/>(Pour bien remplir tous les champs, allez sur le site nautiljon par exemple vous aurez toutes les réponses. Si vous ne trouvez pas, ne mettez rien.)
<br /><br />
 
  <div class="backsm"><div class="titresm">
  <label for="titremangasm"><strong>Titre du manga : </strong> </label>
    <input name="titremangasm" type="text" id="tritremangasm" required="required" /></div>
   
  <center><table class="cadre1sm"><tr><td><div class="imgsm">
  <label for="imgsm"><strong>Lien de l'image : </strong> </label>
    <input name="imgsm" type="text" id="imagsm" required="required" /><br/>(Attention, il faut une<br/> image en format portrait,<br/> par exemple la couverture du tome 01)</div></td>
  <td><div class="presentationsm">
  <label for="titreorism"><strong>♥ Titre original : </strong> </label>
    <input name="titreorism" type="text" id="titreorism"/> <br/>
    <label for="originesm"><strong>♥ Origine : (Pays et année)</strong> </label>
    <input name="originesm" type="text" id="originesm"/> <br/>
    <label for="anneevfsm"><strong>♥ Année VF : </strong> </label>
    <input name="anneevfsm" type="text" id="anneevfsm"/> <br/>
    <label for="typesm"><strong>♥ Type : (Shojo, Shonen, Josei, Seinen, etc...)</strong> </label>
    <input name="typesm" type="text" id="typesm"/> <br/>
    <label for="genresm"><strong>♥ Genres : </strong> </label>
    <input name="genresm" type="text" id="genresm"/> <br/>
    <label for="auteursm"><strong>♥ Auteur : </strong> </label>
    <input name="auteursm" type="text" id="auteursm"/> <br/>
    <label for="editeurvosm"><strong>♥ Éditeur VO : </strong> </label>
    <input name="editeurvosm" type="text" id="editeurvosm"/> <br/>
      <label for="editeurvfsm"><strong>♥ Éditeur VF : </strong> </label>
    <input name="editeurvfsm" type="text" id="editeurvfsm"/> <br/>
    <label for="prepubliesm"><strong>♥ Prépublié dans : </strong> </label>
    <input name="prepubliesm" type="text" id="prepubliesm"/> <br/>
    <label for="nbvolvosm"><strong>♥ Nombre de volumes VO : (Indiqué s'il est (En cours) ou (Terminé) merci)</strong> </label>
    <input name="nbvolvosm" type="text" id="nbvolvosm"/> <br/>
    <label for="nbvolvfsm"><strong>♥ Nombre de volumes VF : (Indiqué s'il est (En cours) ou (Terminé) merci)</strong> </label>
    <input name="nbvolvfsm" type="text" id="nbvolvfsm"/> <br/>
    <label for="prixsm"><strong>♥ Prix public : </strong> </label>
    <input name="prixsm" type="text" id="prixsm"/> <br/>
    <label for="agesm"><strong>♥ Âge conseillé : </strong> </label>
    <input name="agesm" type="text" id="agesm"/> <br/>
    <label for="publicsm"><strong>♥ Pour public averti : </strong> </label>
    <input name="publicsm" type="text" id="publicsm"/> <br/>
    <label for="commercesm"><strong>♥ Se trouve dans le commerce en France : </strong> </label>
    <input name="commercesm" type="text" id="commercesm"/> <br/>
    <label for="adapanimesm"><strong>♥ Existe en anime : </strong> </label>
    <input name="adapanimesm" type="text" id="adapanimesm"/>
    </div></td></tr></table></center>
<div class="titreresumesm">Résumé</div>
<center><div class="cadre2sm"><div class="resumesm">
  <label for="resumesm"><strong>Résumé : </strong> </label>
  <textarea name="resumesm" type="text" id="resumesm" rows="3" cols="60" required="required"></textarea></div></div></center>
    <div class="titreavissm">Votre avis :</div>
    <center><div class="cadre2sm"><div class="avissm">
  <label for="avissm"><strong>Votre avis : </strong> </label>
  <textarea name="avissm" type="text" id="avissm" rows="3" cols="60"></textarea></div></div></center>
 </div>
  <br/><p><input type="submit" name="post" value="Envoyer" /></p><br/>
  </form>
</center>
</body>
</html>


Dernière édition par Mahora le Lun 5 Juin 2017 - 18:59, édité 1 fois
Mahora

Mahora
Nouveau membre

Féminin
Messages : 29
Inscrit(e) le : 17/09/2013

http://univers-du-manga.forumactif.com
Mahora a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec mon formulaire

Message par Walt Lun 5 Juin 2017 - 15:13

Bonjour,

Remplacez cet extrait :
Code:
var txt_message = "<div class='backsm'>\n"
+ "<div class='titresm'>"+ form.titremangasm.value +"</div>\n"
+ "<center><table class='cadre1sm'>\n"
+ "<tr><td><div class='imgsm'><img src='"+ form.imgsm.value +"'/></div></td>\n"
+ "<td><div class='presentationsm'><p><b>♥ Titre original : </b>"+ form.titreorism.value +" </p>\n"
+ "<p><b>♥ Origine : </b>"+ form.originesm.value +" </p>\n"
+ "<p><b>♥ Année VF : </b>"+ form.anneevfsm.value +" </p>\n"
+ "<p><b>♥ Type : </b>"+ form.typesm.value +" </p>\n"
+ "<p><b>♥ Genres : </b>"+ form.genresm.value +" </p>\n"
+ "<p><b>♥ Auteur : </b>"+ form.auteursm.value +" </p>\n"
+ "<p><b>♥ Éditeur VO : </b>"+ form.editeurvosm.value +" </p>\n"
+ "<p><b>♥ Éditeur VF : </b>"+ form.editeurvfsm.value +" </p>\n"
+ "<p><b>♥ Prépublié dans : </b>"+ form.prepubliesm.value +" </p>\n"
+ "<p><b>♥ Nombre de volumes VO : </b>"+ form.nbvolvosm.value +" </p>\n"
+ "<p><b>♥ Nombre de volumes VF : </b>"+ form.nbvolvfsm.value +" </p>\n"
+ "<p><b>♥ Prix public : </b>"+ form.prixsm.value +" </p>\n"
+ "<p><b>♥ Âge conseillé : </b>"+ form.agesm.value +" </p>\n"
+ "<p><b>♥ Pour public averti : </b>"+ form.publicsm.value +" </p>\n"
+ "<p><b>♥ Se trouve dans le commerce en France : </b>"+ form.commercesm.value +" </p>\n"
+ "<p><b>♥ Existe en anime : </b>"+ form.adapanimesm.value +" </p>\n"
+ "</div></td></tr></table></center>\n"
+ "<div class='titreresumesm'>Résumé</div>\n"
+ "<center><div class='cadre2sm'>\n"
+ "<div class='resumesm'>"+ form.resumesm.value +" </div></div></center>\n"
+ "<div class='titreavissm'>Votre avis</div>\n"
+ "<center><div class='cadre2sm'>\n"
+ "<div class='avissm'>"+ form.avissm.value +" </div></div></center>\n"
+ "</div><br/>\n";

Par :
Code:
var txt_message = "<div class='backsm'>\n"
+ "<div class='titresm'>"+ form.titremangasm.value +"</div>\n"
+ "<center><table class='cadre1sm'>\n"
+ "<tr><td><div class='imgsm'><img src='"+ form.imgsm.value +"'/></div></td>\n"
+ "<td><div class='presentationsm'><p><b>♥ Titre original : </b>"+ form.titreorism.value +" </p>\n"
+ "<p><b>♥ Origine : </b>"+ form.originesm.value +" </p>\n"
+ "<p><b>♥ Année VF : </b>"+ form.anneevfsm.value +" </p>\n"
+ "<p><b>♥ Type : </b>"+ form.typesm.value +" </p>\n"
+ "<p><b>♥ Genres : </b>"+ form.genresm.value +" </p>\n"
+ "<p><b>♥ Auteur : </b>"+ form.auteursm.value +" </p>\n"
+ "<p><b>♥ Éditeur VO : </b>"+ form.editeurvosm.value +" </p>\n"
+ "<p><b>♥ Éditeur VF : </b>"+ form.editeurvfsm.value +" </p>\n"
+ "<p><b>♥ Prépublié dans : </b>"+ form.prepubliesm.value +" </p>\n"
+ "<p><b>♥ Nombre de volumes VO : </b>"+ form.nbvolvosm.value +" </p>\n"
+ "<p><b>♥ Nombre de volumes VF : </b>"+ form.nbvolvfsm.value +" </p>\n"
+ "<p><b>♥ Prix public : </b>"+ form.prixsm.value +" </p>\n"
+ "<p><b>♥ Âge conseillé : </b>"+ form.agesm.value +" </p>\n"
+ "<p><b>♥ Pour public averti : </b>"+ form.publicsm.value +" </p>\n"
+ "<p><b>♥ Se trouve dans le commerce en France : </b>"+ form.commercesm.value +" </p>\n"
+ "<p><b>♥ Existe en anime : </b>"+ form.adapanimesm.value +" </p>\n"
+ "</div></td></tr></table></center>\n"
+ "<div class='titreresumesm'>Résumé</div>\n"
+ "<center><div class='cadre2sm'>\n"
+ "<div class='resumesm'>"+ form.resumesm.value +" </div></div></center>\n";

if( form.avissm.value != "" ) {
    txt_message+= "<div class='titreavissm'>Votre avis</div>\n"
    + "<center><div class='cadre2sm'>\n"
    + "<div class='avissm'>"+ form.avissm.value +" </div></div></center>\n"
    + "</div><br/>\n";
}

Pour faire simple, on coupe la variable txt_message en deux pour que la dernière partie (l'avis) ne soit ajoutée que si le contenu du champ "avis" est différent de vide ( != "" ).

Il vous faut procéder de la sorte pour chaque champ que vous souhaitez ne pas afficher s'il n'est pas rempli.

Cordialement,
Walt
Walt

Walt
Modéractif
Modéractif

Masculin
Messages : 6081
Inscrit(e) le : 08/09/2015

Walt a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème avec mon formulaire

Message par Mahora Lun 5 Juin 2017 - 17:35

Bonjour et merci beaucoup Smile
Mahora

Mahora
Nouveau membre

Féminin
Messages : 29
Inscrit(e) le : 17/09/2013

http://univers-du-manga.forumactif.com
Mahora a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum