Injecter du HTML avec des champs dans un formulaire

**Ceubex** · 18/12/2012, 14h21

Bonjour,

J'injecte tout le HTML de mon formulaire (monForm.innerHTML=monHTML). Et ensuite je valide mon formulaire. Problème : quand par derrière je fait print_r($_POST) en PHP pour voir ce que j'ai envoyé il m'affiche que la variable est vide. Pourtant le formulaire est bien en POST.

J'ai recontrolé le code HTML injécté (avec Firefox) et tout est OK. Les champs sont au bon endroit et s'affichent bien. Ca devrait marché normalement mais c'est comme si mon navigateur ne comprenait pas que les champs que j'ai injecté dans le <form> doivent être pris en compte dans l'envoi du formulaire. Je me demande si par derrière il ne faudrait pas reconstruire la hierarchie des objets de la page mais je ne sais pas comment faire

Invité · 18/12/2012, 15h46

Salut,

Tu peux poster le code du code HTML de ton formulaire STP ?

**Ceubex** · 18/12/2012, 16h45

Euh en fait je recompose plus ou moins le code en fonction de certaines choses :
Je te poste ma page, ça te vas ou il faut que je condense ?

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
<!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" lang="en-US"><head profile="http://gmpg.org/xfn/11"><link media="all" href="theme/widget097.css" type="text/css" rel="stylesheet">
 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<link rel="stylesheet" href="theme/screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="theme/print.css" type="text/css" media="print">
<link rel="stylesheet" href="theme/defaults.css" type="text/css" media="screen, projection">
 
<link rel="stylesheet" href="theme/style.css" type="text/css" media="screen, projection">
 
<link rel="stylesheet" id="wp-pagenavi-css" href="theme/pagenavi-css.css" type="text/css" media="all">
 
<!-- Featured Posts -->
<script src="theme/jquery.js" type="text/javascript"></script>
<!-- /jquery.cycle.all.min.js -->
 
 
 
<body class="home blog">
 
<div id="wrapper">
 
    <div id="container" class="container">
 
        <div id="header" class="span-24">
 
            <div class="branding"></div><!-- .branding --><!-- .header-right -->
 
        </div><!-- #header -->
 
 
    <div id="main" class="span-24">
 
        <div id="content-wrap" class="span-16">
          <div class="content">
 
 
            <div class="post-wrap">
 
        <div class="post-34 post type-post status-publish format-standard hentry category-apple-mac category-featured-posts category-imac category-sports tag-elements tag-sports post clearfix" id="post-34">
          <h2 class="title"><a href="" title="" rel="bookmark">Profil de structure (emplacements des widgets)</a></h2>
            <div class="entry"> <script src="http://pifex.fr/comptes/effilab/pifex.js"></script>
 
 
<script>
 
var numEmplacement=0;
function getListe()
{
        numEmplacement++;
        return '<select id="emplacement'+numEmplacement+'" style="width:200px">      <option value="aucun">Aucun</option>      <option value="conv">Conversions - Somme (Chiffre)</option>      <option value="cpa">CPA - Moyenne (Chiffre)</option>      <option value="convVsCpa">Conv Vs CPA (Courbes)</option>      <option value="cClics">Clics - Somme (Chiffre)</option>      <option value="clics">Clics (Courbe)</option>      <option value="regions">Clics par régions (Carte)</option>      <option value="cCost">Cost - Somme (Chiffre)</option>      <option value="clicsVsCost">Clics Vs Cost (Courbes)</option>      <option value="campagnesParCost">Campagnes par Cost (Camembert)</option>      <option value="motsClefsNua">Mots clés (Nuage mots)</option>      <option value="motsClefs">Mots clés (Histogramme)</option>      <option value="motsClefsAnal">Mots clés naturels (Histogramme)</option>      <option value="motsClefsInternaute">Mots clés rééllement tapés (Histogramme)</option>      <option value="SeoVsSea">SEA vs SEO vs Affiliation (Cercles)</option>      <option value="ctr">CTR (Chiffre)</option>      <option value="ctrSearch">CTR Search (Chiffre)</option>      <option value="ctrContent">CTR Content (Chiffre)</option>      <option value="positionMoyenne">Position moyenne (Chiffre)</option>      <option value="positionMoyenneSearch">Position moyenne Search (Chiffre)</option>      <option value="positionMoyenneContent">Position moyenne Content (Chiffre)</option>      <option value="annoncesSearch">Annonces Search</option>      <option value="annoncesContent">Annonces Content</option>      <option value="landing">Landing Page (Histogramme)</option>      <option value="emplacements">Emplacements (Histogramme)</option>      <option value="ttr">TTR (Chiffre)</option>      <option value="roi">ROI (Chiffre)</option>      <option value="delai">Délais d\'achat (Histogramme)</option>      <option value="jourVsConv">Jour Cs Conversions (Radar)</option>      <option value="heureVsConv">Heure Vs conversions (Histogramme)</option>      <option value="partClics">Clics : Google vs Partenaires (Histogramme)</option>      <option value="parImpressions">Impressions : Google vs Partenaires (Histogramme)</option>      <option value="parConv">Conversions : Google vs Partenaires (Histogramme)</option>      <option value="partCost">Coût : Google vs Partenaires (Histogramme)</option>      <option value="partCPA">CPA : Google vs Partenaires (Histogramme)</option> </select>';
}
 
function patron(num)
{
        document.getElementById('patron').value=num;
        numEmplacement=0;
        
        switch (num)
        {
                case 1:
                        document.getElementById('structure').innerHTML='<table width="100%" border="0">  <tr>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>  </tr>  <tr>    <td colspan="2" align="center" valign="middle">'+getListe()+'</td>    <td colspan="2" align="center" valign="middle">'+getListe()+'</td>  </tr>  <tr>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>  </tr></table>';
                break;  
                
                
                case 2:
                        document.getElementById('structure').innerHTML='<table width="100%" border="0">  <tr>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>  </tr>  <tr>    <td colspan="4" align="center" valign="middle">'+getListe()+'</td>    </tr>  <tr>    <td colspan="4" align="center" valign="middle"><table width="100%" border="0">  <tr>    <td>'+getListe()+'</td>    <td>'+getListe()+'</td>    <td>'+getListe()+'</td>  </tr></table></td>    </tr></table>';
                break;  
                
                
                case 3:
                        document.getElementById('structure').innerHTML='<table width="100%" border="0">  <tr>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>    <td align="center" valign="middle">'+getListe()+'</td>  </tr>  <tr>    <td colspan="2" align="center" valign="middle">'+getListe()+'</td>  <td colspan="2" align="center" valign="middle">'+getListe()+'</td>  </tr>  <tr>    <td colspan="2" align="center" valign="middle">'+getListe()+'</td>    <td colspan="2" align="center" valign="middle">'+getListe()+'</td>    </tr></table>';
                break;  
        }
}
 
function setItemEmplacement(idEmplacement,monItem)
{
        var liste=document.getElementById('emplacement'+idEmplacement);
        for(i=0;i<liste.options.length;i++)
        {
                if(liste.options[i].value==monItem)
                        liste.selectedIndex = i
        }
}
 
function setModele(modele)
{
        //de gauche à droite puis de haut en bas
        if(modele=='sea')
        {
                patron(1)
                
                setItemEmplacement(1,'cClics');
                setItemEmplacement(2,'cCost');
                setItemEmplacement(3,'conv');
                setItemEmplacement(4,'cpa');
                setItemEmplacement(5,'clicsVsCost');
                setItemEmplacement(6,'convVsCpa');
                setItemEmplacement(7,'campagnesParCost');
                setItemEmplacement(8,'motsClefs');
                setItemEmplacement(9,'SeoVsSea');
                setItemEmplacement(10,'regions');
        }
        else if(modele=='campagnes')
        {
                patron(2)
                
                setItemEmplacement(1,'aucun');
                setItemEmplacement(2,'cClics');
                setItemEmplacement(3,'cCost');
                setItemEmplacement(4,'aucun');
                setItemEmplacement(5,'clicsVsCost');
                setItemEmplacement(6,'campagnesParCost');
                setItemEmplacement(7,'motsClefs');
                setItemEmplacement(8,'regions');
        }
        else if(modele=='conversions')
        {
                patron(2)
                
                setItemEmplacement(1,'conv');
                setItemEmplacement(2,'cpa');
                setItemEmplacement(3,'ttr');
                setItemEmplacement(4,'roi');
                setItemEmplacement(5,'convVsCpa');
                setItemEmplacement(6,'delai');
                setItemEmplacement(7,'jourVsConv');
                setItemEmplacement(8,'heureVsConv');
        }
        else if(modele=='annonces')
        {
                patron(3)
                
                setItemEmplacement(1,'ctrSearch');
                setItemEmplacement(2,'positionMoyenneSearch');
                setItemEmplacement(3,'ctrContent');
                setItemEmplacement(4,'positionMoyenneContent');
                setItemEmplacement(5,'annoncesSearch');
                setItemEmplacement(6,'annoncesContent');
                setItemEmplacement(7,'landing');
                setItemEmplacement(8,'emplacements');
        }
}
</script>
 
 
<form id="form" name="form" method="post" action=""> 
<div align="right">Modèle : <select name="modele" onchange="setModele(this.options[this.selectedIndex].value)">
              <option value="sea">Bilan des Performances SEA</option>
              <option value="campagnes">Campagnes et mots clés</option>
              <option value="conversions">Conversions</option>
              <option value="annonces">Annonces et Landing Page</option>
            </select></div>
  <input name="patron" type="hidden" id="patron" value="1" />
  <br /><hr />
 
 
<div id="structure"></div>
 
  <p>
  <div style="text-align: center">
      <p>
        <input type="submit" name="Générer" id="Générer" value="Valider" style="font-size:25px" />
      </p>
  </div>
  <br />
    <select id="df" style="width:200px;display:none">
      <option value="aucun">Aucun</option>
      <option value="conv">Conversions - Somme (Chiffre)</option>
      <option value="cpa">CPA - Moyenne (Chiffre)</option>
      <option value="convVsCpa">Conv Vs CPA (Courbes)</option>
      <option value="cClics">Clics - Somme (Chiffre)</option>
      <option value="clics">Clics (Courbe)</option>
      <option value="regions">Clics par régions (Carte)</option>
      <option value="cCost">Cost - Somme (Chiffre)</option>
      <option value="clicsVsCost">Clics Vs Cost (Courbes)</option>
      <option value="campagnesParCost">Campagnes par Cost (Camembert)</option>
      <option value="motsClefsNua">Mots clés (Nuage mots)</option>
      <option value="motsClefs">Mots clés (Histogramme)</option>
      <option value="motsClefsAnal">Mots clés naturels (Histogramme)</option>
      <option value="motsClefsInternaute">Mots clés rééllement tapés (Histogramme)</option>
      <option value="SeoVsSea">SEA vs SEO vs Affiliation (Cercles)</option>
      <option value="ctr">CTR (Chiffre)</option>
      <option value="ctrSearch">CTR Search (Chiffre)</option>
      <option value="ctrContent">CTR Content (Chiffre)</option>
      <option value="positionMoyenne">Position moyenne (Chiffre)</option>
      <option value="positionMoyenneSearch">Position moyenne Search (Chiffre)</option>
      <option value="positionMoyenneContent">Position moyenne Content (Chiffre)</option>
      <option value="annoncesSearch">Annonces Search</option>
      <option value="annoncesContent">Annonces Content</option>
      <option value="landing">Landing Page (Histogramme)</option>
      <option value="emplacements">Emplacements (Histogramme)</option>
      <option value="ttr">TTR (Chiffre)</option>
      <option value="roi">ROI (Chiffre)</option>
      <option value="delai">Délais d'achat (Histogramme)</option>
      <option value="jourVsConv">Jour Cs Conversions (Radar)</option>
      <option value="heureVsConv">Heure Vs conversions (Histogramme)</option>
      <option value="partClics">Clics : Google vs Partenaires (Histogramme)</option>
      <option value="parImpressions">Impressions : Google vs Partenaires (Histogramme)</option>
      <option value="parConv">Conversions : Google vs Partenaires (Histogramme)</option>
      <option value="partCost">Coût : Google vs Partenaires (Histogramme)</option>
      <option value="partCPA">CPA : Google vs Partenaires (Histogramme)</option>
    </select>
    <br />
  </p>
  <script>
  setModele('sea');
</script>
</form>
            </div>
        </div>
    </div><!-- Post ID 34 --><!-- Post ID 63 --><!-- Post ID 62 --><!-- Post ID 61 --><!-- Post ID 60 --><!-- Post ID 59 -->
 
 
 
    <div class="navigation clearfix"></div><!-- .navigation -->
 
 
 
  </div><!-- .content -->
 
 
    </div><!-- #content-wrap --><!-- #primary-sidebar-wrap -->
 
</div><!-- #main -->
 
 
    <div id="footer-wrap" class="span-24">
 
        <div id="footer">
 
            <div id="copyrights">Effilab</div>
 
            <!-- #copyrights -->
 
            <div id="credits"></div><!-- #credits -->
 
        </div><!-- #footer -->
 
    </div><!-- #wrap-footer -->
 
</div><!-- #container -->
 
</div><!-- #wrapper -->
<div id="bas"> </div>
 
 
</body></html>

Invité · 18/12/2012, 17h26

Je n'ai pas le temps pour l'instant de bien tout décortiquer, mais après un examen rapide, j'ai noté que beaucoup de tes select (et notamment tous ceux que tu injectes) n'ont pas d'attribut name. Donc ces derniers ne seront pas transmis au serveur lors du submit. (du moins je crois, le HTML n'étant pas ma spécialité, loin de là).

**Ceubex** · 18/12/2012, 17h55

Tu as tout à fait raison. Le problème vient de là. J'étais pourtant persuadé de l'avoir verifier. Mais quand on revient sur son code pour la qunzième fois, on ne s'en aperçoit plus. Excuse moi pour le dérangement et merci pour ton aide

Injecter du HTML avec des champs dans un formulaire

JavaScript

Discussions similaires

Partager

Partager