Problème avec mon formulaire

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

Résolu Problème avec mon formulaire

Message par Mahora le Dim 4 Juin - 0: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 - 16:59, édité 1 fois
avatar

Mahora
Nouveau membre

Féminin
Messages : 15
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 le Lun 5 Juin - 13: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
avatar

Walt
Modéractif
Modéractif

Masculin
Messages : 2871
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 le Lun 5 Juin - 15:35

Bonjour et merci beaucoup Smile
avatar

Mahora
Nouveau membre

Féminin
Messages : 15
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


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