Discussion :

[DiPSoMaNiE]

Bonjour à tous,

Voilà je suis débutant avec AJAX, et je rencontre un problème dont je ne trouve pas la solution

J'ai une page avec un formulaire de rédaction en method=post, pour insérer des données dans une base SQL.

Dans cette page de formulaire, j'inclus la page php insertion.php, qui traîte les données pour les insérer dans ma base lorsque le bouton submit est cliqué.

Au chargement de ma page de rédaction, je fais appelle à une fonction AJAX asynchrone, qui demande à une autre page php de me renvoyer des données, que j'insère dans un div avec :

Code :

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

1
2
 
document.getElementById(id).innerHTML = req.responseText;

Cette autre page php dont ajax récupère les données, écrit des images et des input :

Code :

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

1
2
3
4
5
6
 
for ($i=0; $i < $nbrFiles; $i++ )
 {
         echo $files[$i]; 
         echo $input[$i];
 }

où $files[$i] est un array d'images, et $input est un array de différents input.

Donc dans ma page de rédaction, il n'y a pas de problème pour l'affichage, AJAX injecte bien les images et les input dans le div cible.

Mais lorsque l'on soumet le formulaire, ma page insertion.php ne voit pas les $_POST[] qui correspondent aux input qui ont été injectés par la fonction AJAX dans le div du formulaire.

J'ai entendu parlé pour ajax de la méthode send, mais je ne sais pas où et comment je pourrais appeler cette méthode, à quelle page l'envoyer, pour ce que lorsqu'on soumet le formulaire, la page insertion.php soit capable de voir les $_POST[] qui correspondent aux input injectés par la fonction AJAX

Merci de votre aide

[DoubleU]

Tu utilises quoi comme navigateur?

Car l'ajout dynamique d'élément de formulaire via innerHTML pose des problèmes (notamment sous IE) pour récupérer les valeurs coté serveur.

[DiPSoMaNiE]

Tu utilises quoi comme navigateur?

Car l'ajout dynamique d'élément de formulaire via innerHTML pose des problèmes (notamment sous IE) pour récupérer les valeurs coté serveur.

J'utilise firefox, mais ça ne marche sur aucun navigateur, que ce soit firefox 3.0.9, 3.1b, ou bien IE 7 ou 8.

Je pense tout simplement que ma page insertion.php, ne voit pas les <input> qui ont été injecté dans le <div> qui se trouve au sein du formulaire.

C'est comme si ces input n'étaient pas dans le formulaire

[DoubleU]

Essaie de les ajouter via le DOM et non via innerHTML (si c'est ce que tu faisais)

[DiPSoMaNiE]

Essaie de les ajouter via le DOM et non via innerHTML (si c'est ce que tu faisais)

Je ne connais pas grand chose en AJAX...

Quel pourrait être l'équivalent en DOM ?

J'ai trouvé un exemple comme ceci :

Code :

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

1
2
3
 
longueurCible = document.getElementById("textDiv").firstChild.length;
document.getElementById("textDiv").firstChild.replaceData(0, longueurCible, "Texte de remplacement");

Mais ça ne marche pas...

[DoubleU]

Ta requete te retourne quoi comme chaine, j'ai du mal a me rendre compte?

[DiPSoMaNiE]

Ta requete te retourne quoi comme chaine, j'ai du mal a me rendre compte?

bah ma requête c'est le résultat d'une autre page php (principe de l'ajax quoi).

Ma fonction est lancée, elle appelle une page php, cette page php fait son boulot, elle fait des echo d'input de type hidden et d'images, selon ce qu'elle a trouvé.

Ensuite, ajax récupère le résultat de cette page, donc les echo des images et des input, et l'injecte dans un <div> qui est dans le formulaire sur la page de rédaction.

Au moment de la soumission, les input ne sont pas trouvés par la page insertion.php qui check si elle trouve ces input... c'est comme s'ils n'étaient pas dans le formulaire

[DoubleU]

bah ma requête c'est le résultat d'une autre page php (principe de l'ajax quoi).

Le principe d'ajax, techniquement, c'est juste d'envoyer une requete HTTP depuis le client vers le serveur.

Ce que tu devrais faire, c'est ne pas formater le retour de ta requete pour faire simplement un innerHTML du résultat mais plutot renvoyer les informations nécessaires pour recréer les éléments a ajouter via le DOM.

Attention, sous IE pour que tes éléments puissent être reconnus lors de la soumission du formulaire, il faut que tu crées les éléments de cette facon:

Code :

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

var inp = document.createElement("<input name='foo'>")

alors que sous FF c'est

Code :

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

1
2
var inp = document.createElement("input");
inp.name = "foo";