Problème formulaire "JavaScript"

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

Résolu Problème formulaire "JavaScript"

Message par wilose le Jeu 25 Aoû 2011 - 12:00

Bonjour à tous,
Je suis administrateur du forum "no-stress"
Je donne un coup de main au fondateur, on a décidé de créer un formulaire de présentation, j'ai fouillé partout et je n'est toujours pas résolu le problème Exclamation
Le formulaire a été fait d'après les cours du site du zéro.
J'ai suivis ce tutoriel pour le JavaScript.
voici mon code:
Spoiler:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html  xmlns="http://www.w3.org/1999/xhtml" dir="ltr" id="min-width" lang="fr" xml:lang="fr"  >
    <head>
      <title>Présentation</title>
      <meta http-equiv="content-type" content="text/html; charset=utf-8;" />
<style type="text/css">
body{
  text-align: center;
  font-family: comic Sans MS,Arial;
  background-color: black;}
.cc{
  color: white;}
.baniere{
  color: white;
  text-align: center;
  margin-bottom: 10px;
  margin-left: auto ;
  margin-right: auto ;
  border-style: inset;
  border-color: rgb(254,160,2);
  border-width: 2px;
  width: 700px;
  height: 60px;
  background: url("http://i41.servimg.com/u/f41/15/31/09/28/banier12.png");}
.titresujet{
  color: white;}
input:focus, textarea:focus {/* Quand le curseur est sur un champ */
  background-color: #FFFF99;}
fieldset{
  margin-bottom: 15px; /* Une marge pour séparer les fieldset */
  background-color: #deffba;}
legend{
  background-color: #deffba;
  color: #5da5ff;
  font-weight: bold;}
</style>
    </head>
    <body><div class="baniere">
<h2>Bonjour bienvenus sur le formulaire.</h2>
</div>
<p class="cc">Pour pouvoir remplir ce formulaire, vous devez impérativement être connecté.

Une fois le formulaire remplis, cliquer sur "envoyer" et votre message serra automatiquement posté dans la section "<a href="http://no-stress.ogameunivers.com/f1-presentation" title="cliquer pour y aller" target=_blank>présentation</a>".</p>

<!--début JavaScript-->
<script type="text/javascript">
function envoiMessage(form)
{
  // Créer un message à partir des informations fournies
  var txt_message = "[b]Nom :[/b] " + form.nom.value + '\n'
              + "[b]Prénom :[/b] " + form.prenom.value + '\n'
              + "[b]Ma tranche d'âge :[/b]\n[list]";
              // Dans le cas des checkboxs, on va les parcourir pour prendre la valeur de celles qui sont cochées:
              for(var i = 0; i < form.age.length; i++)
              {
                  if(form.age[i].checked == true) { txt_message = txt_message + '[*]' + form.age[i].value + '\n'; }
              + "[b]Genre: :[/b]\n[list]";
              // Dans le cas des checkboxs, on va les parcourir pour prendre la valeur de celles qui sont cochées:
              for(var i = 0; i < form.genre.length; i++)
              {
                  if(form.genre[i].checked == true) { txt_message = txt_message + '[*]' + form.genre[i].value + '\n'; }
              txt_message = txt_message + "[/list][b]Comment j'ai connus ce forum :[/b] : " + form.connu.value + '\n';
              + "[b]Quel est ma profession :[/b] " + form.profession.value + '\n'
              + "[b]j'aime bien [/b]\n[list]";
              // Dans le cas des checkboxs, on va les parcourir pour prendre la valeur de celles qui sont cochées:
              for(var i = 0; i < form.aime.length; i++)
              {
                  if(form.aime[i].checked == true) { txt_message = txt_message + '[*]' + form.aime[i].value + '\n'; }
              txt_message = txt_message + "[/list][b]Complément :[/b] : " + form.complement.value + '\n';
  // Insère le texte construit dans le champ caché "message" du formulaire
  form.message.value = txt_message;
}
</script>
<!--fin JavaScript-->

<form method="post" action="http://no-stress.ogameunivers.com/posting.forum" name="post" enctype="multipart/form-data">

  <fieldset>
      <legend>Vos coordonnées</legend>

      <label for="nom">Quel est votre nom ?</label>

      <input type="text" name="nom" id="nom" tabindex="10" />


      <label for="prenom">Quel est votre prénom ?</label>

      <input type="text" name="prenom" id="prenom" tabindex="20" />

     
      <p>
      Votre tranche d'âge:

      <input type="radio" name="age" value="moins de 15 ans" id="moins15" /> <label for="moins15">Moins de 15 ans</label>

      <input type="radio" name="age" value="15-25 ans" id="15-25" /> <label for="15-25">15-25 ans</label>

      <input type="radio" name="age" value="25-40 ans" id="25-40" /> <label for="25-40">25-40 ans</label>

      <input type="radio" name="age" value="40-60 ans" id="40-60" /> <label for="40-60">40-60 ans</label>

      <input type="radio" name="age" value="plus de 60 ans" id="plus60" /> <label for="plus60">plus de 60 ans</label>
  </p>
<p>
Genre :
      <input type="radio" name="genre" value="homme" id="homme" /> <label for="homme">homme</label>
      <input type="radio" name="genre" value="femme" id="femme" /> <label for="femme">femme</label>
</p>
<p>
          <label for="connu">Comment avez vous connus ce forum?</label>

          <textarea name="connu" id="connu" cols="40" rows="4" tabindex="80"></textarea>
      </p>

<label for="profession">Quel est votre profession ?</label>

<select name="profession" id ="profession">
<option value="selection">Je ne souhaite pas partager cette information</option>
<option value="agriculteurs exploitants">Agriculteurs exploitants</option>
<option value="artisans">Artisans</option>
<option value="Commercants et assimiles">Commerçants et assimilés</option>
<option value="chef entreprise 10 sal ou +">Chefs d'entreprise de 10 salariés ou plus</option>
<option value="professions liberales et assimilees">Professions libérales et assimilées</option>
<option value="cadre fonction publique">Cadre de la fonction publique</option>
<option value="profs, professions scientifiques">Professeurs, professions scientifiques</option>
<option value="professions de l'info, arts, spectacles">Professions de l'information, des arts et des spectacles</option>
<option value="cadres administratifs et commerciaux d'ent">Cadres administratifs et commerciaux d'entreprises</option>
<option value="ingénieurs et cadres techniques d'ent">Ingénieurs et cadres techniques d'entreprises</option>
<option value="prof des écoles, instit et professions ass">Professeurs des écoles, instituteurs et professions assimilées</option>
<option value="professions intermédiaires de la sante et du travail social">Professions intermédiaires de la santé et du travail social</option>
<option value="professions intermédiaires administratives de la fonction publique">Professions intermédiaires administratives de la fonction publique</option>
<option value="professions intermédiaires administrative et commerciales des entreprises">Professions intermédiaires administratives et commerciales des entreprises</option>
<option value="techniciens (sauf techniciens tertiaires)">Techniciens (sauf techniciens tertiaires)</option>
<option value="contremaitres, agents de maitrise (maitrise administrative exclue)">Contremaîtres, agents de maîtrise (maîtrise administrative exclue)</option>
<option value="employé civils et agents de service de la fonction publique">Employé civils et agents de service de la fonction publique</option>
<option value="agents de surveillance (policiers etc.)">Agents de surveillance (policiers etc.)</option>
<option value="employés administratifs d'entreprise">Employés administratifs d'entreprise</option>
<option value="employés de commerce">Employés de commerce</option>
<option value="personnels des services directs aux particuliers">Personnels des services directs aux particuliers</option>
<option value="ouvriers qualifies de type industriel">Ouvriers qualifiés de type industriel</option>
<option value="ouvriers qualifies de type artisanal">Ouvriers qualifiés de type artisanal</option>
<option value="chauffeurs">Chauffeurs</option>
<option value="ouvriers qualifies de la manutention, du magasinage et du transport">Ouvriers qualifiés de la manutention, du magasinage et du transport</option>
<option value="ouvriers agricoles et assimiles">Ouvriers agricoles et assimilés</option>
<option value="ouvrier qualifie">Ouvrier qualifié</option>
<option value="ouvrier non qualifie">Ouvrier non qualifié</option>
<option value="retraite agriculteur exploitant">Retraité agriculteur exploitant</option>
<option value="retraite artisan, commerc., chef d'entreprise">Retraité artisan, commercial, chef d'entreprise</option>
<option value="retraite cadre, profession intermediaire">Retraité cadre, profession intermédiaire</option>
<option value="retraite employe, ouvrier">Retraité employé, ouvrier</option>
<option value="chomeur n'ayant jamais travaille">Chômeur n'ayant jamais travaillé</option>
<option value="personne sans activite professionnelle">Personne sans activité professionnelle</option>
<option value="non renseignee">Non renseignée </option>
</select>

 
  </fieldset>

  <fieldset>
      <legend>Vos loisirs et passions</legend>

      <p>
          Que préférez vous?

          <input type="radio" name="aime" value="le sport" id="sport" tabindex="40" /> <label for="sport">Le sport</label>

          <input type="radio" name="aime" value="la littérature" id="litterature" tabindex="50" /> <label for="litterature">La littérature</label>

          <input type="radio" name="aime" value="le cinéma" id="cinema" tabindex="60" /> <label for="cinema">Le cinéma</label>

      </p>

      <p>
          <label for="complement">Complément :</label>

          <textarea name="complement" id="complement" cols="40" rows="4" tabindex="80"></textarea>
      </p>
  </fieldset>

<!--liaison du formulaire au forum champs invisibles-->

        <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 = Note / 2 = annonce) -->
        <input type="hidden" name="message" value="" /> <!-- Contiendra le texte du message -->
        <input type="hidden" name="f" value="1" /> <!--  ID du forum dans lequel le message sera posté-->
        <label for="titre"><span class="titresujet">Titre du sujet (ex:ton pseudo; bonjour...etc):</span></label>
 <input type="text" name="subject" id="titre" value="" size="45" maxlength="60" />
<!--fin de liaison-->
  <p>
      <input type="submit" /> <input type="reset" />
  </p>
 
</form>
    </body>
    </html>
Quand je clique sur "envoyer", je me retrouve dans "nouveau sujet" dans la section "présentation" et il n'y a rien d'écrit
Merci d'avance pour votre précieuse aide, je vous en serai très reconnaissant.
Cordialement. salut


Dernière édition par wilose le Ven 26 Aoû 2011 - 10:47, édité 1 fois

wilose
Nouveau membre

Messages : 5
Inscrit(e) le : 25/08/2011

http://no-stress.ogameunivers.com/
wilose a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème formulaire "JavaScript"

Message par Scoubifitz le Jeu 25 Aoû 2011 - 18:18

bonsoir,

un premier regard ...

vous n'avez pas ante-slashé les apostrophes dans vos phrases ... Clin d\'oeil

Code:
... Ma tranche d\'âge : ...
... Comment j\'ai connus ce forum : ...
... j\'aime bien ...

Scoubifitz
+ Hyperactif +

Masculin
Messages : 3539
Inscrit(e) le : 18/03/2008

http://scoubidous.superforum.fr/
Scoubifitz a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème formulaire "JavaScript"

Message par wilose le Jeu 25 Aoû 2011 - 21:01

Je viens de tester avec les "ante-slashe" et sa ne change rien, je me retrouve toujours sur la page de création d'un nouveau sujet.
Il me semble qu'un apostrophe n'a pas besoin d'être "ante-slashsé" quand il est entouré de guillemets.

wilose
Nouveau membre

Messages : 5
Inscrit(e) le : 25/08/2011

http://no-stress.ogameunivers.com/
wilose a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème formulaire "JavaScript"

Message par Scoubifitz le Ven 26 Aoû 2011 - 7:50

bonjour,

Je vous rassure , il faut bien les ante-slashes ...

De plus , les cases "radio" ne se traitent pas de la même façon que les "checkbox" ...

La balise "form" doit contenir un "onsubmit" pour récupérer le message à envoyer

le bouton "submit" du bas doit porter le même "name" que la balise "form" ...

le code corrigé et fonctionnel :

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  xmlns="http://www.w3.org/1999/xhtml" dir="ltr" id="min-width" lang="fr" xml:lang="fr"  >
<head>
<title>Présentation</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8;" />
<style type="text/css">
body{
text-align: center;
font-family: comic Sans MS,Arial;
background-color: black;}
.cc{
color: white;}
.baniere{
color: white;
text-align: center;
margin-bottom: 10px;
margin-left: auto ;
margin-right: auto ;
border-style: inset;
border-color: rgb(254,160,2);
border-width: 2px;
width: 700px;
height: 60px;
background: url("http://i41.servimg.com/u/f41/15/31/09/28/banier12.png");}
.titresujet{
color: white;}
input:focus, textarea:focus {/* Quand le curseur est sur un champ */
background-color: #FFFF99;}
fieldset{
margin-bottom: 15px; /* Une marge pour séparer les fieldset */
background-color: #deffba;}
legend{
background-color: #deffba;
color: #5da5ff;
font-weight: bold;}
</style>
</head>
<body><div class="baniere">
<h2>Bonjour bienvenus sur le formulaire.</h2>
</div>
<p class="cc">Pour pouvoir remplir ce formulaire, vous devez impérativement être connecté.

Une fois le formulaire remplis, cliquer sur "envoyer" et votre message serra automatiquement posté dans la section "<a href="http://no-stress.ogameunivers.com/f1-presentation" title="cliquer pour y aller" target=_blank>présentation</a>".</p>

<script type="text/javascript">
function envoiMessage(form)
{
// Créer un message à partir des informations fournies
var age = "";
if(form.age[0].checked == true)
age = form.age[0].value;
else if(form.age[1].checked == true)
age = form.age[1].value;
else if(form.age[2].checked == true)
age = form.age[2].value;
else if(form.age[3].checked == true)
age = form.age[3].value;
else if(form.age[4].checked == true)
age = form.age[4].value;
var genre = "";
if(form.genre[0].checked == true)
genre = form.genre[0].value;
else if(form.genre[1].checked == true)
genre = form.genre[1].value;
var aime = "";
if(form.aime[0].checked == true)
aime = form.aime[0].value;
else if(form.aime[1].checked == true)
aime = form.aime[1].value;
else if(form.aime[2].checked == true)
aime = form.aime[2].value;

var txt_message = "[b]Nom :[/b] " + form.nom.value + '\n'
+ "[b]Prénom :[/b] " + form.prenom.value + '\n'
+ "[b]Ma tranche d\'âge :[/b]" + age + '\n'
+ "[b]Genre: :[/b]" + genre + '\n'
+ "[b]Comment j\'ai connu ce forum :[/b] : " + form.connu.value + '\n'
+ "[b]Quelle est ma profession :[/b] " + form.profession.value + '\n'
+ "[b]j\'aime bien [/b]" + aime + '\n'
+ "[b]Complément :[/b] : " + form.complement.value + '\n';
// Insère le texte construit dans le champ caché "message" du formulaire
form.message.value = txt_message;
}
</script>

<form method="post" action="http://no-stress.ogameunivers.com/posting.forum" name="post" enctype="multipart/form-data" onSubmit="envoiMessage(this)" />

<fieldset>
<legend>Vos coordonnées</legend>

<label for="nom">Quel est votre nom ?</label>

<input type="text" name="nom" id="nom" tabindex="10" />


<label for="prenom">Quel est votre prénom ?</label>

<input type="text" name="prenom" id="prenom" tabindex="20" />


<p>
Votre tranche d'âge:

<input type="radio" name="age" value="moins de 15 ans" id="moins15" /> <label for="moins15">Moins de 15 ans</label>

<input type="radio" name="age" value="15-25 ans" id="15-25" /> <label for="15-25">15-25 ans</label>

<input type="radio" name="age" value="25-40 ans" id="25-40" /> <label for="25-40">25-40 ans</label>

<input type="radio" name="age" value="40-60 ans" id="40-60" /> <label for="40-60">40-60 ans</label>

<input type="radio" name="age" value="plus de 60 ans" id="plus60" /> <label for="plus60">plus de 60 ans</label>
</p>
<p>
Genre :
<input type="radio" name="genre" value="homme" id="homme" /> <label for="homme">homme</label>
<input type="radio" name="genre" value="femme" id="femme" /> <label for="femme">femme</label>
</p>
<p>
<label for="connu">Comment avez vous connus ce forum?</label>

<textarea name="connu" id="connu" cols="40" rows="4" tabindex="80"></textarea>
</p>

<label for="profession">Quel est votre profession ?</label>

<select name="profession" id ="profession">
<option value="selection">Je ne souhaite pas partager cette information</option>
<option value="agriculteurs exploitants">Agriculteurs exploitants</option>
<option value="artisans">Artisans</option>
<option value="Commercants et assimiles">Commerçants et assimilés</option>
<option value="chef entreprise 10 sal ou +">Chefs d'entreprise de 10 salariés ou plus</option>
<option value="professions liberales et assimilees">Professions libérales et assimilées</option>
<option value="cadre fonction publique">Cadre de la fonction publique</option>
<option value="profs, professions scientifiques">Professeurs, professions scientifiques</option>
<option value="professions de l'info, arts, spectacles">Professions de l'information, des arts et des spectacles</option>
<option value="cadres administratifs et commerciaux d'ent">Cadres administratifs et commerciaux d'entreprises</option>
<option value="ingénieurs et cadres techniques d'ent">Ingénieurs et cadres techniques d'entreprises</option>
<option value="prof des écoles, instit et professions ass">Professeurs des écoles, instituteurs et professions assimilées</option>
<option value="professions intermédiaires de la sante et du travail social">Professions intermédiaires de la santé et du travail social</option>
<option value="professions intermédiaires administratives de la fonction publique">Professions intermédiaires administratives de la fonction publique</option>
<option value="professions intermédiaires administrative et commerciales des entreprises">Professions intermédiaires administratives et commerciales des entreprises</option>
<option value="techniciens (sauf techniciens tertiaires)">Techniciens (sauf techniciens tertiaires)</option>
<option value="contremaitres, agents de maitrise (maitrise administrative exclue)">Contremaîtres, agents de maîtrise (maîtrise administrative exclue)</option>
<option value="employé civils et agents de service de la fonction publique">Employé civils et agents de service de la fonction publique</option>
<option value="agents de surveillance (policiers etc.)">Agents de surveillance (policiers etc.)</option>
<option value="employés administratifs d'entreprise">Employés administratifs d'entreprise</option>
<option value="employés de commerce">Employés de commerce</option>
<option value="personnels des services directs aux particuliers">Personnels des services directs aux particuliers</option>
<option value="ouvriers qualifies de type industriel">Ouvriers qualifiés de type industriel</option>
<option value="ouvriers qualifies de type artisanal">Ouvriers qualifiés de type artisanal</option>
<option value="chauffeurs">Chauffeurs</option>
<option value="ouvriers qualifies de la manutention, du magasinage et du transport">Ouvriers qualifiés de la manutention, du magasinage et du transport</option>
<option value="ouvriers agricoles et assimiles">Ouvriers agricoles et assimilés</option>
<option value="ouvrier qualifie">Ouvrier qualifié</option>
<option value="ouvrier non qualifie">Ouvrier non qualifié</option>
<option value="retraite agriculteur exploitant">Retraité agriculteur exploitant</option>
<option value="retraite artisan, commerc., chef d'entreprise">Retraité artisan, commercial, chef d'entreprise</option>
<option value="retraite cadre, profession intermediaire">Retraité cadre, profession intermédiaire</option>
<option value="retraite employe, ouvrier">Retraité employé, ouvrier</option>
<option value="chomeur n'ayant jamais travaille">Chômeur n'ayant jamais travaillé</option>
<option value="personne sans activite professionnelle">Personne sans activité professionnelle</option>
<option value="non renseignee">Non renseignée </option>
</select>


</fieldset>

<fieldset>
<legend>Vos loisirs et passions</legend>

<p>
Que préférez vous?

<input type="radio" name="aime" value="le sport" id="sport" tabindex="40" /> <label for="sport">Le sport</label>

<input type="radio" name="aime" value="la littérature" id="litterature" tabindex="50" /> <label for="litterature">La littérature</label>

<input type="radio" name="aime" value="le cinéma" id="cinema" tabindex="60" /> <label for="cinema">Le cinéma</label>

</p>

<p>
<label for="complement">Complément :</label>

<textarea name="complement" id="complement" cols="40" rows="4" tabindex="80"></textarea>
</p>
</fieldset>

<!--liaison du formulaire au forum champs invisibles-->

<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 = Note / 2 = annonce) -->
<input type="hidden" name="message" value="" /> <!-- Contiendra le texte du message -->
<input type="hidden" name="f" value="1" /> <!--  ID du forum dans lequel le message sera posté-->
<label for="titre"><span class="titresujet">Titre du sujet (ex:ton pseudo; bonjour...etc):</span></label>
<input type="text" name="subject" id="titre" value="" size="45" maxlength="60" />
<!--fin de liaison-->
<p>
<input type="submit" name="post" /> <input type="reset" />
</p>

</form>
</body>
</html>

Scoubifitz
+ Hyperactif +

Masculin
Messages : 3539
Inscrit(e) le : 18/03/2008

http://scoubidous.superforum.fr/
Scoubifitz a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème formulaire "JavaScript"

Message par wilose le Ven 26 Aoû 2011 - 10:21

Un grand merci à vous!!! Hero
Mais une dernière question avant de mettre "résolue", est-se normal si le sujet ne se poste pas automatiquement? Y a t-il un moyen de le faire?

wilose
Nouveau membre

Messages : 5
Inscrit(e) le : 25/08/2011

http://no-stress.ogameunivers.com/
wilose a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème formulaire "JavaScript"

Message par wilose le Ven 26 Aoû 2011 - 10:47

Non en faite c'est très bien comme sa, encore merci!! Yes Affirmatif

wilose
Nouveau membre

Messages : 5
Inscrit(e) le : 25/08/2011

http://no-stress.ogameunivers.com/
wilose a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème formulaire "JavaScript"

Message par Scoubifitz le Ven 26 Aoû 2011 - 15:17

bonjour,

Si vous avez vu le message dans la fenêtre d'édition sans qu'il ne se poste , c'est qu'il manquait le titre du sujet ...

Amicalement,
Scoubifitz

Scoubifitz
+ Hyperactif +

Masculin
Messages : 3539
Inscrit(e) le : 18/03/2008

http://scoubidous.superforum.fr/
Scoubifitz 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