Bonsoir,

J'ai un fichier .js qui contient un formulaire grâce à des document.write('');. J'aimerai pouvoir rafraichir mon fichier .js lorsque le formulaire est posté.

Merci d'avance.

J'ai envie de dire "Gné?"
Je n'ai pas compris du tout ce que tu voulais dire.
Rafraîchir ton fichier js?
Tu peux rafraîchir la page (window.location.reload()), mais je ne suis pas certain que ce soit ton but.

Oui, c'est assez tordu, je te l'accorde

J'ai une page HTML qui importe un fichier .js, comme ceci :

<script type="text/javascript" src="http://localhost:8888/page.php"></script>

Tu l'auras sûrement remarqué, le fichier importé est au format .php. Seulement, je transforme celui-ci en JS comme ceci :

header("Content-type: text/javascript");

Cette astuce me permet de mettre du PHP dans ce fichier que j'importe. Ce fichier page.php exécute un certain nombre d'instructions et affiche un formulaire. Mon problème est que je ne sais pas comment traiter les données du formulaire...

Pour t'aider à comprendre, voici un schéma récapitulatif de page.php que j'importe dans un fichier html :

<?php
header("Content-type: text/javascript");

if(isset($_POST['rep']))
{
// Traitement. Problème : comment faire le traitement "à l'intérieur" de page.php qui se trouve lui même dans un fichier HTML ?
}
?>
document.write('<form method="post" action="page.php">');
document.write('Aimez-vous le SDZ ?');
document.write('<input type="radio" name="rep" value="oui" id="oui"/> <label for="oui">Oui</label><br/>');
document.write('<input type="radio" name="rep" value="non" id="non"/> <label for="non">Non</label>');
document.write('</form>');

D'un coup, c'est plus clair!

Je vais supposer que tu n'as pas le choix de l'architecture de ta page, sinon j'ai du mal à comprendre pourquoi tu fais quelque chose d'aussi ... tordu

Je partirai sur quelque chose de ce genre pour page.php :

<?php
header("Content-type: text/javascript");

if(isset($_GET['rep_oui'])&&isset($_GET['rep_non']))
{
   $texte_a_afficher = ""; // calcule le texte à afficher en fonction des paramètres reçus
   echo "document.getElementById('formulaire_choucroute').innerHTML='".addslashes($texte_a_afficher)."'";
} else {
?>
document.write('<div id="formulaire_choucroute"><form method="post" action="page.php">');
document.write('Aimez-vous le SDZ ?');
document.write('<input type="radio" name="rep" id="rep_oui" value="oui" id="oui"/> <label for="oui">Oui</label><br/>');
document.write('<input type="radio" name="rep" id="rep_non" value="non" id="non"/> <label for="non">Non</label>');
document.write('<button onclick="valider_fom_choucroute()">Valider</button>'
document.write('</form></div>');

var valide_form_choucroute = function () {
   var rep_oui = document.getElementById('rep_oui').checked;
   var rep_non = document.getElementById('rep_non').checked;
   document.write('<script type="text/javascript" src="http://localhost:8888/page.php?rep_oui='+rep_oui+'&rep_non='+rep_non+'"></script>');
}
<?php
}
?>

Je suis passé en GET, car je ne vois pas comment envoyer les données en POST à page.php sans passer en AJAX, et tu souhaites faire l'appel via une balise script.
Ainsi, quand tu cliques sur le bouton, la fonction insère une balise script qui va se charger et exécuter son code. En l'occurence, le code sera généré par la page PHP, qui entrera dans la condition isset(...), calculera le texte à afficher, et l'affichera. En l'occurence ici, j'ai remplacé le texte du formulaire par la réponse, mais libre à toi de ne pas faire cela.

PS : pourquoi choucroute? parce que j'ai faim.

Merci pour ta réponse !

Ta méthode fonctionne, mais j'aimerai éviter de passer les données en $_GET... Si j'ai bien compris, l'emploi de l'AJAX est obligatoire afin de se servir de $_POST ? Mes connaissances en AJAX sont plutôt limitées malheureusement mais j'ai entendu parler de XMLHTTPREQUEST. Tu t'y connais en AJAX ? Tu crois que c'est dur à mettre en place ?

Merci et bon appétit !

Heu, XMLHTTPREQUEST et AJAX, c'est quand même la même chose
Pour ce qui est de ce que tu souhaites faire ici, clairement, c'est un dialogue avec le serveur. En effet, tu lui demandes quoi afficher avec les données que tu as dans ton formulaire.
Donc une question à se poser avant tout :
Est ce que c'est essentiel de tout faire de manière dynamique ou est ce que envoyer les données de manière classique (avec un submit) ne serait pas plus simple?

Deuxième question : pourquoi faire une inclusion d'un script pour afficher ton formulaire au lieu de l'afficher normalement? J'ai du mal à comprendre ça...

Si tu souhaites faire cela de manière dynamique, pas de soucis.
Non, l'AJAX n'est pas si compliqué que cela. Mais évitons de réinventer la roue et ajoutons un framework. Personnellement, j'utilise prototype.
A ajouter dans le head :

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js"></script>

Et ensuite, ta page deviens ceci :

<?php
header("Content-type: text/javascript");
?>
document.write('<div id="formulaire_choucroute"><form method="post" action="page.php">');
document.write('Aimez-vous le SDZ ?');
document.write('<input type="radio" name="rep" id="rep_oui" value="oui" id="oui"/> <label for="oui">Oui</label><br/>');
document.write('<input type="radio" name="rep" id="rep_non" value="non" id="non"/> <label for="non">Non</label>');
document.write('<button onclick="valider_fom_choucroute()">Valider</button>'
document.write('</form></div>');

var valide_form_choucroute = function () {
   var rep_oui = $('rep_oui').checked;
   var rep_non = $('rep_non').checked;
   new Ajax.Request('url_de_page_2.php', {
	method : 'POST',
	parameters : {
		rep_oui : rep_oui ,
		rep_non : rep_non
	},
	onSuccess : function (transport) {
		var retour = transport.responseText;
		$('formulaire_choucroute').innerHTML = retour;
	}
   });
}
<?php
}
?>

La page "url_de_page_2.php" est la partie conditionnée par le isset de page.php. Il est intéressant de les séparer, pour plus de lisibilité à mon sens. Ainsi, tu auras bien les données envoyées en POST.
Pour explication de ce que j'utilise :
$('quelquechose') remplace document.getElementById('quelquechose') (fonction de prototype)
Ajax.Request crée une requête AJAX, et on lui passe plusieurs paramètres :
- method : la méthode d'envoie
- parameters : les paramètres, ici au format json
- onSuccess : la fonction à exécuter quand on récupère la réponse du serveur. transport.responseText contient les données que tu afficheras sur page2.php (via echo par exemple)