textarea dynamique et $_POST

Version imprimable

Bonjour,

J'ai un problème pour récupérer une valeur de mon formulaire.

Je vous explique. J'ai un group de radio bouton. En fonction du choix de ce group j'affiche une deuxième question. (si l'utilisateur choisit yes, une question A s'affiche, sinon une question F s'affiche)
Code:

1 2 3 4 5 6 7 8 <form method="post" onsubmit="return checkQuestionnaire()"> <input type="radio" name="group1" onclick="WriteNextQuestion(this);" value="YesAppFunctioned" > Yes<br> <input type="radio" name="group1" onclick="WriteNextQuestion(this);" value="NoAppFunctioned"> No<br> <div id="MaQuestion"></div> .. <input type="submit" class="button" name="feedbackSubmit" value="Submit" /> </form>
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 <script> function WriteNextQuestion(BtnRadio) { var LeHTMLdeMaQuestion; if(BtnRadio.value=="YesAppFunctioned") { LeHTMLdeMaQuestion="<textarea name=\"comment2a\" rows=5 style=\"font-size: 9pt; width: 570px; padding-left:5px; padding-top:5px;\"></textarea>"; } if(BtnRadio.value=="NoAppFunctioned") { LeHTMLdeMaQuestion="<textarea name=\"comment2b\" rows=5 style=\"font-size: 9pt; width: 570px; padding-left:5px; padding-top:5px;\"></textarea>"; } var DivDeMaQuestion=document.getElementById('MaQuestion'); DivDeMaQuestion.innerHTML=LeHTMLdeMaQuestion; } </script>
Cela marche bien. Je peux également bien vérifier que le textarea est rempli dans mon javascript.

Seulement, lorsque je veux sauver ma variable (le contenu des textarea) pour l'insérer dans ma base de donnée, elle semble ne pas être définie.
Le test suivant ne passe pas.
Code:

1 2 3 4 5 6 7 8 <? if(isset($_POST['comment2a'])) { ... } ?>
Je ne comprend pas pourquoi. je peux récupérer tous les autres champs du formulaire hormis ceux que j'ai "déclaré" depuis ma fonction WriteNextQuestion

Une idée?

Merci d'avance

14/08/2009, 16h17
andry.aime

Bonjour,
N'utilise pas innerHTML pour créer un élément mais utilise DOM:
http://javascript.developpez.com/faq...DOM#DOMajouter

Merci pour cette réponse andry.aime,

Le code que j'ai donné est une version simplifiée. En fait le code html que je crée dans ma fonction javascript est le suivant:
Code:

1 2 3 4 5 6 7 8 9 10 LeHTMLdeMaQuestion="Why do you remove the application? </td>\n"; LeHTMLdeMaQuestion+="</tr>\n"; LeHTMLdeMaQuestion+="<tr>\n"; LeHTMLdeMaQuestion+="<td valign=\"top\" colspan=2>\n"; LeHTMLdeMaQuestion+="<textarea name=\"comment2a\" rows=5 style=\"font-size: 9pt; width: 570px; padding-left:5px; padding-top:5px;\" class=\"surveyContent-input\" onfocus=\"this.className=\'surveyfocused\'\" onblur=\"this.className=\'surveyinput\'\"></textarea>\n"; LeHTMLdeMaQuestion+="</td>\n"; LeHTMLdeMaQuestion+="</tr>\n"; LeHTMLdeMaQuestion+="<tr><td colspan=\"2\"><div class=\"surveyPadding-top10\"></div>\n";
car mon formulaire fait parti d'un tableau plus général.

J'ai regardé un peu le lien que tu m'as donné. Mais est-ce possible de remplir ma div

Code:

<div id="MaQuestion"></div>

de la même façon en utilisant un DOM alors que le code html que je voudrais ajouter ne contient pas qu'un textarea?

Je ne sais pas si je suis très clair...

14/08/2009, 19h23
SpaceFrog

Citation:

J'ai regardé un peu le lien que tu m'as donné. Mais est-ce possible de remplir ma div

Si tu avais regardé un peu plus en détail tu ne poserais pas la question ... :roll:

L'affichage est maintenant correct avec DOM, mais j'ai toujours un problème pour transmettre le formulaire. Voici ce que j'ai fais:

Mon formulaire HTML

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 
<form method="post" onsubmit="return checkFormulaire()">
<tr>
<td colspan="2" valign="top" align="left" style="padding-left:5px;">Did the soft function? <br></td>
</tr>
<tr>
 <td colspan="2" valign="top" align="left">
<input type="radio" name="group1"   value="YesSoftFunctioned" onclick="WriteNextQuestion(this);"> Yes<br>
<input type="radio" name="group1"   value="NoSoftFunctioned"  onclick="WriteNextQuestion(this);"> No<br>
</td>
</tr>
<tr><td colspan="2"><div class="surveyPadding-top10"></div></td>
</tr>
 
<tr>
 <td colspan="2" valign="top" align="left" style="padding-left:5px;"><div id="Question2"></div></td>
</tr>
<tr>
<td valign="top" colspan=2 style="padding-left:5px;"><div id="Answer2"></div></td>
</tr>
 
<tr>
<td colspan="2" align="right" style="padding-right:5px;"><input type="submit" class="button" name="feedbackSubmit" value="Submit"  /></td>
</tr>
</form>

Javascript

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
 
function WriteNextQuestion(BtnRadio)
{
       // Parent node
       var divParentQuestion2 = document.getElementById('Question2');
       // Remove if child already exists
       var olddivQuestion2 = document.getElementById('labelQuestion2Id');
       if(olddivQuestion2)
           divParentQuestion2.removeChild(olddivQuestion2);
 
       // create new nodes 
       var nouveauDivQuestion2 = document.createElement('div');
       nouveauDivQuestion2.setAttribute("id","labelQuestion2Id");
       var Question2Label = document.createElement('label');    
 
       if(BtnRadio.value== "YesSoftFunctioned")
       {
          Question2Label.appendChild(document.createTextNode("Why do you remove the product?"));
 
       }
       if(BtnRadio.value=="NoSoftFunctioned")
       {
          Question2Label.appendChild(document.createTextNode("What didn't function?"));
       }
       // bind nodes
       divParentQuestion2.appendChild(nouveauDivQuestion2);
       nouveauDivQuestion2.appendChild(Question2Label);
 
       // Parent node
       var divParentAnswer2 = document.getElementById('Answer2');
       // Remove if child already exists
       var olddivAnswer2 = document.getElementById('textAreaQuestion2Id');
       if(olddivAnswer2)
           divParentAnswer2.removeChild(olddivAnswer2);
 
       // create new node
       var nouveauDivAnswer2 = document.createElement('div');
       var Question2TestArea = document.createElement('textarea');
       Question2TestArea.setAttribute("id","textAreaQuestion2Id");
       Question2TestArea.setAttribute("name","comment2");
       Question2TestArea.setAttribute("rows","5");
       Question2TestArea.setAttribute("style","font-size: 9pt; width: 570px; padding-left:5px; padding-top:5px;");
       Question2TestArea.setAttribute("class","surveyContent-input");
       Question2TestArea.setAttribute("onfocus","this.className='surveyForm-focused'");
       Question2TestArea.setAttribute("onblur","this.className='surveyContent-input'");
 
       // bind nodes
       divParentAnswer2.appendChild(nouveauDivAnswer2);
       nouveauDivAnswer2.appendChild(Question2TestArea);
}

Quand je soumet mon formulaire, je n'arrive pas à accéder au contenu de mon textarea nommé "comment2"

Si je fais

Code:

1
2
3
4
5
6
7
 
<?
if(isset($_POST['feedbackSubmit']))
{ 
print_r($_POST);
}
?>

J'ai ceci qui s'affiche

Array ( [group1] => YesSoftFunctioned [group2] => No [feedbackSubmit] => Submit )

Je n'ai donc rien pour mon textarea nommé "comment2".

En fin de compte, c'est toujours le même problème que j'avais avec innerHTML.

Qu'est-ce qui cloche?