Modification de ; Formulaire de présentation par Onyx

Bonjour à tous,

Je trouve le formulaire présenté par Onyx ici >>> https://www.never-utopia.com/t60709-formulaire-de-presentation vraiment extraordinaire!!
En plus, pas besoin pour le membre de savoir lire un code pour le remplir et cela est un énorme plus pour mon forum.

Le problème c'est que les questions ne correspondent pas à ce que j'aurais besoin.
Moi je m'en servirais sur un forum d'aquariophilie et cela permettrait aux membres qui ont des problèmes de remplir le questionnaire et le staff aurait directement les informations pour répondre aux problèmes.

J'ai fais une image pour représenter ce que j'aimerais, la coici;

Spoiler:

Voilà plus ou moins ce que j'aimerais. En fait il faut laisser "la structure" comme elle est d'origine, mais il faut changer les questions réponses.

Pour les images d'origine que Onyx avait placé tout dans le fond de son questionnaire, là pour moi on peux laisser comme elle avait fait et laissé le choix au posteur de les changer.

Voilà! Je suppose qu'il faudra plus de détails, mais avant de m'avancer j'aimerais savoir si cela est possible. Si un codeur pourrait voir cela et surtout si il a le temps vu que mon niveau de codage est sous les pâquerette.

Merci d'avance en espérant d'avoir de l'aide, parce que ce style de questionnaire est vraiment tip top.

A bientôt.

Bonjour,

Mis à part moi, personne ne vient lire ici??

Normal??

Coucou, si j'ai bien compris, tu veux juste modifié les questions ? (garder la même structure, etc.)

Bonjour,

oui c'est exactement cela. J'ai juste fais une erreur dans mon image du modèle, le "nom" doit disparaître. 
Mais je me perd vraiment dans le code. Je ne vois pas tous les endroit où il faut le changer. (Boulet!)

Merci d'avance.

Désolée, je pensais y arrivé, mais au final, je suis comme toi :/

Re,

OK! 

Merci quand même.

Personne pour m'aider??

Coucou

Pour ton petit 'problème' que j'appellerais surtout 'souhait' je te propose un texte. L'habitude est d'avoir peur de différencier le PHP, et le HTML, alors qu'ils sont tous les deux liés. C'est pour cela que je te propose une explication.

Code:

script type="text/javascript">
        //<!--
          /*Fonction pour créer le message*/
          function creationMessage(NomForm) { 
             
            /* On met le titre dans le champ "titre" */
            NomForm.titre.value =
              "Présentation de " + NomForm.prenom.value + " " + NomForm.nom.value;
            /* On met le message dans le champ "message" */
            NomForm.message.value =
              "<link href='https://fonts.googleapis.com/css?family=Lobster|Pacifico|Dancing+Script' rel='stylesheet' type='text/css' />" +
              "<div class='prez'>" +
              "<img src='" + NomForm.urlimghaut.value + "' class='prez_haut' />" +
              "<div class='prez_nom'>" + NomForm.prenom.value + " " + NomForm.nom.value + "</div>" +
              "<div class='prez_citation'>« " + NomForm.citation.value + " »</div>" +
              "<div class='prez_bloc'>" +
              "<img src='" + NomForm.urlimgava.value + "' class='prez_ava' />" +
              "<div class='prez_right'>" +
              "<span class='prez_champ'>Prénom :</span> " + NomForm.prenom.value + "<br />" +
              "<span class='prez_champ'>Nom :</span> " + NomForm.nom.value + "<br />" +
              "<span class='prez_champ'>Surnom :</span> " + NomForm.surnom.value + "<br />" +
              "<span class='prez_champ'>Âge :</span> " + NomForm.age.value + "<br />" +
              "<span class='prez_champ'>Groupe :</span> " + NomForm.group.value + "<br />" +
              "<span class='prez_champ'>Pouvoir :</span> " + NomForm.pouvoir.value + "<br />" +
              "<span class='prez_champ'>Aime :</span> " + NomForm.aime.value + "<br />" +
              "<span class='prez_champ'>Déteste :</span> " + NomForm.deteste.value + "<br />" + "</div><div style='clear: both;'></div></div><div class='prez_title'>" +
              "Description physique</div><div class='prez_bloc'>" + NomForm.descphy.value + "</div><div class='prez_title'>" +
              "Description psycologique</div><div class='prez_bloc'>" + NomForm.descpsy.value + "</div><div class='prez_title'>" +
              "Histoire</div><div class='prez_bloc'>" + NomForm.hist.value + "</div><div class='prez_title'>" +
              "Informations sur le joueur</div><div class='prez_bloc'>" +
              "<img src='" + NomForm.urlimgbas.value + "' class='prez_bas' />" +
              "<div class='prez_right2'>" +
              "<span class='prez_champ'>Prénom :</span> " + NomForm.nomhrp.value + "<br />" +
              "<span class='prez_champ'>Âge :</span> " + NomForm.agehrp.value + "<br />" +
              "<span class='prez_champ'>Comment j'ai connu le forum :</span> " + NomForm.connu.value + "<br />" +
              "<span class='prez_champ'>Mon avis sur le forum :</span> " + NomForm.avis.value + "<br />" +
              "<span class='prez_champ'>Le code secret :</span> [hide]" + NomForm.secret.value + "[/hide]</div><div style='clear: both;'></div></div>" +
              "<div class='prez_credit'>Par <a href='http://www.never-utopia.com/u27' target='_blank'>Onyx</a> de <a href='http://www.never-utopia.com' target='_blank'>Never-Utopia</a>, inspiré de <a href='http://www.never-utopia.com/t43339-fiche-bois-sombre' target='_blank'>cette fiche</a> de Pastomaniac.</div></div></div>";

            /*On vérifie si on peut ou non envoyer le message*/
            var champsobligatoires = document.getElementsByClassName("obligatoire");
            var totalchampsobligatoires = 0;
            for (i = 0; i < champsobligatoires.length; i++) {
              var champvaleur = champsobligatoires[i].value;
              if (champvaleur.length > 0) {
                totalchampsobligatoires = totalchampsobligatoires + 1;
              }
            }
            if (totalchampsobligatoires < champsobligatoires.length) {
              alert("Tous les champs obligatoires (ceux avec un astérisque rouge) doivent être remplis car ils sont obligatoires.");
              return false;
            }
            else {
              return true;
            }
          }
        //-->
        </script>

ça c'est le script, tout ce qui sera en accord avec les champs de saisi sur le formulaire.. Donc, pour pas de problème, ça ne servira presque à rien ( pour ne pas se perdre ) de modifier au moins un champ, une balise ou même un mot.

Et ce qui sera encore plus facile de modifier le HTML, qui est:

Code:

<body>
        <form id="monId" action="/posting.forum" method="post" name="NomForm" enctype="multipart/form-data" target="_blank" onSubmit="return creationMessage(this)">
          <input type="hidden" name="mode" value="newtopic" />
          <input type="hidden" name="topictype" value="0" checked="checked" />
          <input type="hidden" name="message" value="" />
          <input type="hidden" name="f" value="10" />
          <input type="hidden" name="subject" id="titre" value="" />
          <h1>Formulaire de Présentation</h1>
          <h2>Informations sur le personnage</h2>
          <label for="prenom">Prénom<span class="redd">*</span> :</label><br />
          <input class="obligatoire" type="text" name="prenom" id="prenom" /><br />
          <br />
          <label for="nom">Nom<span class="redd">*</span> :</label><br />
          <input class="obligatoire" type="text" name="nom" id="nom" /><br />
          <br />
          <label for="surnom">Surnom :</label><br />
          <input type="text" name="surnom" id="surnom" /><br />
          <br />
          <label for="age">Âge<span class="redd">*</span> :</label><br />
          <input class="obligatoire" type="text" name="age" id="age" /><br />
          <br />
          <label for="group">Groupe<span class="redd">*</span> :</label><br />
          <select name="group" id="group">
            <option>Premier</option>
            <option>Deuxième</option>
            <option>Troisième</option>
            <option>Quatrième</option>
            <option>Etc.</option>
          </select><br />
          <br />
          <label for="pouvoir">Pouvoir<span class="redd">*</span> :</label><br />
          <input class="obligatoire" type="text" name="pouvoir" id="pouvoir" /><br />
          <br />
          <label for="aime">Aime<span class="redd">*</span> :</label><br />
          <input class="obligatoire" type="text" name="aime" id="aime" /><br />
          <br />
          <label for="deteste">Déteste<span class="redd">*</span> :</label><br />
          <input class="obligatoire" type="text" name="deteste" id="deteste" /><br />
          <br />
          <h2>Descriptions du personnage</h2>
          <label for="descphy">Description Physique<span class="redd">*</span> :</label><br />
          <textarea class="obligatoire" name="descphy" id="descphy"></textarea><br />
          <br />
          <br />
          <label for="descpsy">Description Psychologique<span class="redd">*</span> :</label><br />
          <textarea class="obligatoire" name="descpsy" id="descpsy"></textarea><br />
          <br />
          <br />
          <label for="hist">Histoire<span class="redd">*</span> :</label><br />
          <textarea class="obligatoire" name="hist" id="hist"></textarea><br />
          <br />
          <br />
          <h2>Informations sur le joueur</h2>
          <label for="nomhrp">Prénom :</label><br />
          <input type="text" name="nomhrp" id="nomhrp" /><br />
          <br />
          <label for="agehrp">Âge :</label><br />
          <input type="text" name="agehrp" id="agehrp" /><br />
          <br />
          <label for="connu">Comment avez-vous connu le forum<span class="redd">*</span> ?</label><br />
          <input class="obligatoire" type="text" name="connu" id="connu" /><br />
          <br />
          <label for="avis">Votre avis sur le forum ?</label><br />
          <textarea name="avis" id="avis"></textarea><br />
          <br />
          <label for="secret">Le code secret<span class="redd">*</span> ?</label><br />
          <input class="obligatoire" type="text" name="secret" id="secret" /><br />
          <br />
          <h2>Personnaliser la mise en page</h2>
          <label for="urlimghaut">URL de l'image du haut (500px par 200px) :</label><br />
          <input type="text" name="urlimghaut" id="urlimghaut" value="http://img15.hostingpics.net/pics/959085haut.jpg" /><br />
          <br />
          <label for="citation">Petite citation :</label><br />
          <input type="text" name="citation" id="citation" value="Petite citation" /><br />
          <br />
          <label for="urlimgava">URL de l'image du personnage (200px par 320px) :</label><br />
          <input type="text" name="urlimgava" id="urlimgava" value="http://img15.hostingpics.net/pics/485538middle.jpg" /><br />
          <br />
          <label for="urlimgbas">URL de l'image du joueur (100px par 100px) :</label><br />
          <input type="text" name="urlimgbas" id="urlimgbas" value="http://img15.hostingpics.net/pics/858946bas.jpg" /><br />
          <br />
          <br />
          <div style="text-align: center;">
            <input type="reset" name="reseta" value="Rénitialiser le formulaire" />
            <input type="submit" name="preview" value="Prévisualiser le formulaire" />
            <input type="submit" name="post" value="Envoyer le formulaire" />
          </div>
          <br />
          <div class="credits">Par <a href="http://www.never-utopia.com/u27" target="_blank">Onyx</a> de <a href="http://www.never-utopia.com" target="_blank">Never-Utopia</a>.</div>
        </form>
      </body>

C'est un peu du n'importe quoi, mais c'est déjà une explication claire que je viens de faire pour délimiter les parties que tu peux modifier et ceux qui est inutil. Et pour modifier les champs, les questions, tu n'as qu'à juste modifier la balise "label". Je t'explique:

Code:

<label for="prenom">Prénom<span class="redd">*</span> :</label>

Tu dois juste remplacer 'Prénom' par ta question ou la consigne que tu veux. Et tu peux faire ça pour tous ! Il doit juste y avoir label devant et le champ se modifiera.

Bonsoir Applauze et merci pour ces renseignements.

Je ne suis pas certain d'avoir tout compris, mais je vais relire cela à tête reposée.

Avant de commencer mes expériences et de mettre ma famille en danger en cas de mauvaise volonté de mon PC à comprendre mes demandes, juste une question; 
-Et si je veux supprimer un champs, par exemple j'aimerais supprimer la question "NOM". Je dois supprimer cette partie du code dans le HTML

Code:

<label for="nom">Nom<span class="redd">*</span> :</label><br />[size=16][/size]
          <input class="obligatoire" type="text" name="nom" id="nom" /><br />[size=16][/size]
          <br />

Mais la partie du script à supprimer ce n'est quand meme pas cette partie??>>

Code:

"<span class='prez_champ'>Nom :</span> " + NomForm.nom.value + "<br />" +

Le texte qui est dans le script en brun, entre les balises /* texte */  Il correspond à quoi?? (le code ici plus haut vient de cette partie).

Encore merci pour ton aide ....
Je vais faire le maximum pour m'en sortir, mais il y a beaucoup de chance que je doive revenir vers le forum.

Bonne soirée.

Re,

Non, c'est vraiment trop compliqué, je n'y arrive pas.
Ce n'est pas du tout mon domaine et je n'ai aucune base, Grrrr!!


Je ne vois pas où il faut changer les phrases pour que cela change dans le formulaire qui s'affiche en réponse final???


Edit: Non, j'abandonne!!

Je ne pense pas que tu peux abandonner aussi vite ^^'..

Pour modifier un champ ou même le supprimer, tu dois repérer la balise label comme tu l'as fait dans ta réponse .o.

Louaque a écrit:

Code:

<label for="nom">Nom<span class="redd">*</span> :</label><br />[size=16][/size]
              <input class="obligatoire" type="text" name="nom" id="nom" /><br />[size=16][/size]

c'est complètement ça que tu dois supprimé, et si tu veux modiier ttu n'as qu'à juste modifier le Nom.

Je vois que tu es curieuse et que tu veux regarder le script.. Et comme d'habitude tu as raison. C'est parfaitement ce bout de code-là

Code:

"<span class='prez_champ'>Nom :</span> " + NomForm.nom.value + "<br />" +

que tu dois supprimer, si tu veux complètement supprimé le champ. Mais si tu veux simplement modifier la question, tu n'y touche pas.. Car ça ne changera rien, à part si tu rechanges dans le HTML un autre bout de code.

J'espère que je t'ai aidé, je déteste abandonné ( je suis mauvais perdant x) ) donc, je ne voulais pas te laisser couler dans la défaite.. Et je voulais que tu profites de ce formulaire magnifique.

Bonjour,

Je suis mauvais perdant aussi (qualité ou défaut??) Mais il faut aussi savoir se rendre compte de la supériorité de l'adversaire!

Maintenant tu sais motiver les troupes! je vais encore faire un essai, je vais persévérer.

Mais j'arrive à modifier les questions. Mais quand je clique sur "envoyer le formulaire", dans la réponse qui s'affiche ce sont encore les anciennes questions qui sont affichées. Et je ne trouve pas ou changer ces phrases.

Autre casse tête; comme faire si je dois ajouter des questions?? 
Je sais les ajouter, elles s'ajouteront bien dans le formulaire des questions, mais encore une fois, pas dans la réponse.

Tu vois, je suis au ras des pâquerettes dans le niveau!

Bonne journée!

Salut,

C'est bien de perséverer, il ne faut jamais s'avérer perdant avant avoir combattu.. Pour changer le nom dans la réponse, il faut chercher dans le script aussi.. Pour t'aider, tout le script, c'est la réponse, c'est tout ce qui figurera dans la réponse. Donc si tu veux avoir une question, et la réponse identique tu dois changer aussi la question dans le script.. Je t'explique en code:

Code:

<label for="nom">Nom<span class="redd">*</span> :</label><br />
          <input class="obligatoire" type="text" name="nom" id="nom" /><br />
          <br />

imaginon suq je supprime le Nom en Âge.. Dans le script je vais changer ça:

Code:

"<span class='prez_champ'>Nom :</span> " + NomForm.nom.value + "<br />" +

aussi, le 'Nom :' à côtés de span, je le change..

Pour ajouter des questions, c'est aussi simple.. Tu copies-colles juste en dessous.. Tu prends ce code:"

Code:

<label for="nom">Nom<span class="redd">*</span> :</label><br />
          <input class="obligatoire" type="text" name="nom" id="nom" /><br />
          <br />

tu le copies puis tu le colles, tu changes la question ça veut dire " label for=" tu le changes aussi.. Mais là où sa se complique c'est dans le script.
Tu copies aussi ce bout de code:

Code:

"<span class='prez_champ'>Nom :</span> " + NomForm.nom.value + "<br />" +

sauf que la tu vas changer comme tout à l-heure le 'nom' pour la question.. Et tu vas aussi changé le nom au milieu de NomForm et value tu changes par le label.. Donc, pour t'aider en image.
Je rajoute ce bout cette question:

Code:

<label for="prenom">Prénom<span class="redd">*</span> :</label><br />
          <input class="obligatoire" type="text" name="prenom" id="prenom" /

que je change en 'lycée':

Code:

<label for="lycée">Lycée:<span class="redd">*</span> :</label><br />
          <input class="obligatoire" type="text" name="prenom" id="lycée" />

et donc dans le script, je vais mettre:

Code:

"<div class='prez_nom'>" + NomForm.lycée.value + " </div>

J'espère t'avoir aidé, mais ne te sous-estime jamais.. Il est vrai que ce sujet est difficile, mais il faut le faire un jour où l'autre.

Bonsoir,

Vous pouvez classer le sujet.

Vu que c'est bien trop difficile pour moi de modifier le code et que je pense que je n'aurais pas d'aide.

Bien à vous.