Tom's Guide > Forum > Programmation > [AJAX] Ecrire le contenu d'un formulaire dans un div

[AJAX] Ecrire le contenu d'un formulaire dans un div

Forum Programmation : [AJAX] Ecrire le contenu d'un formulaire dans un div

TomsGuide.com : 800 000 inscrits répondent à toutes vos questions high-tech et informatique. Pour obtenir de l'aide, inscrivez-vous gratuitement !

Créer un nouveau sujet Répondre

Bas de page Chercher dans ce sujet

Salut à tous,
je vous explique mon problême. Je commence en AJAX et j'aimerais pour le moment afficher un fomulaire, dans lequel j'écris ce que je veux, et que, lorsque je valide, cela m'écrive le contenu de mon fomulaire dans un DIV.
Je mettrais ensuite un simple rechargement de page.
C'est en gros le début d'un minichat Ajax, mais vraiment le début :kaola: .

Voilà mon code:

Code :

<html>
<head>
<script type="text/javascript" src="ajax.js"></script>
<script type="text/javascript">
function ecrire(contenu)
{
var xhr;
try
{
xhr = new XMLHttpRequest();
}
catch(e)
{
xhr = new ActiveXObject(Microsoft.XMLHTTP);
}
xhr.onreadystatechange = function()
{
if (xhr.readyState == 4 && xhr.status == 200)
{
document.getElementById("envoyes" ).innerHTML = contenu;
}
else
{
document.getElementById("envoyes" ).innerHTML = "Erreur" + xhr.status;
}
};
}
function envoyer()
{
var message = document.ajax.message.value;
ecrire(message);
}
</script>
<title>Ecrire et lire en AJAX</title>
</head>
<body>
<div id="envoyes"></div>
<form name="ajax" id="ajax" method="post" action="">
<input type="text" name="message" size="50" /><br/>
<input type="submit" value="Envoyer" onClick='envoyer()' />
</form>
</body>
</html>

Voilà en gros quand je clique sur le bouton, il récupère la valeur de message, puis appelle ensuite la fonction ecrire, justement pour ecrire cette phrase dans la div #envoyes, mais ça ne marche pas.

Si vous avez une idée je vous serais très reconnaissant de me la partagée.
Merci.

Répondre

Inscrivez-vous ou connectez-vous pour masquer ceci.

Et en quoi ajax t'es utile la ????

Tu n'as pas compris à quoi servait ajax toi ...

Ajax est utilie si tu as besoin d'appeler un script (fichier) distant , comme un script php ....

La t'as fonction écrire doit se résumer à ça :

function ecrire(contenu)
{
document.getElementById("envoyes" ).innerHTML = contenu
}

Et c'est tout.

------------------------------ Découvrer des vidéos et des images de sports extrêmes (ski, monocycle, vtt, etc...)
Répondre à Kymic@IDN

Bonjour,

En fait là, tu ne fais pas vraiment une requête, et tu n'as pas besoin d'AJAX dans ce que tu veux faire !
"AJAX" n'est nécessaire que si tu veux appeler une page pour récupérer une valeur ou quelque chose comme ça. Alors que là, tu n'en as pas besoin du tout, vu que c'est sur la même page.

Déjà, le premier problème, c'est que ton input est de type submit, donc quand tu cliques dessus, ça valide le formulaire, et ça rafraichit la page. Passe le input en type button.

En fait, pour faire ton chat, il faudrait que tu ai une base de données qui stocke les messages, et que tu ai une page qui ajoute les messages dans la base de données, et une page pour les retourner.
Et à ce moment là, tu pourras faire un peu d'AJAX.

------------------------------ Les dessins des seins ou les desseins des saints ?
Répondre à OmaR

Effectivement ce n'est pas pour le moment de l'AJAX mais ayant pour but de créer un MiniChat en AJAX, je préférais présenter mon problême dans cette optique.
Bien sur oui pour le moment je n'utilise pas d'AJAX, mais comme j'ai eu un problême avant d'en arriver à AJAX, alors j'ai demander en me projetant, peut etre trop tôt, dans le futur.
Pour finir, j'ai passé mon input en type bouton mais ça n'a pas l'air de marcher ... peut être ai-je fais une erreur ...
Si vous voulais bien me mettre le code pour que je vérifie.

En tout cas merci pour vos réponses !!!

Répondre à foester

Si tu passes l'input en type button, ça ne va pas marcher non plus, car tu ne fais pas de requête, comme kymic t'as dit, tu as juste besoin de faire :

function ecrire(contenu)
{
document.getElementById("envoyes" ).innerHTML = contenu ;
}

Message édité par OmaR le 08-08-2007 à 22:31:23

------------------------------ Les dessins des seins ou les desseins des saints ?
Répondre à OmaR

# xhr.onreadystatechange = function()
# {
# if (xhr.readyState == 4 && xhr.status == 200)
# {
# document.getElementById("envoyes" ).innerHTML = contenu;
# }
#
# else
# {
# document.getElementById("envoyes" ).innerHTML = "Erreur" + xhr.status;
# }
# };

Cette partie de ton code n'est jamais appelé.

Pour qu'elle soit appelé il faut que tu exécute cette fonction xhr.send() ...

Voila rajoute ces deux lignes en bas de ta fonction :

xhr.open("GET","fichier.ext",true);
xhr.send(null);

Ce ceci aura pour effet d'appeler le fichier fichier.ext (pour le moment crée le vide). Et donc maintenant la partie xhr.onreadystatechange devrait s'exécuter ....

------------------------------ Découvrer des vidéos et des images de sports extrêmes (ski, monocycle, vtt, etc...)
Répondre à Kymic@IDN

Créer un nouveau sujet Répondre

Tom's Guide > Forum > Programmation > [AJAX] Ecrire le contenu d'un formulaire dans un div

Aller à :

Aide |
Règles du forum

Il y a 663 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.

Page générée en 0,259 secondes

Attention

Vous allez répondre sur un sujet resté inactif pendant plus de 6 mois.
Assurez-vous d'apporter des éléments nouveaux à la discussion avant de poursuivre.

Répondre Annuler

Liens