Formulaire ajax

DoI3y Messages postés 57 Statut Membre -
DoI3y Messages postés 57 Statut Membre - 24 nov. 2009 à 16:43

Bonjour,

je souhaiterz réaliser une fonctionnalité pour un formulaire. La voici :
Après avoir répondu a une question par oui ou par non, je souhaite afficher un textarea.

Je sais qu'il faut que j'utilise la technologie ajax mais j'en est aucune notions.

Quelqu'un peut-il m'aider? ou encore me filer des liens vers des tutos qui pourrait solutionner ce problème?

Afficher la suite

1 réponse

DoI3y Messages postés 57 Statut Membre 24

voici un code que j'ai adaptée mais qui ne fonctionne pas :

page : textarea.php

<html>
	<head>
		<title>Tutoriel Ajax (XHTML + JavaScript + XML)</title>
		<script type='text/javascript'>
	 
			function getXhr(){
                                var xhr = null; 
				if(window.XMLHttpRequest) // Firefox et autres
				   xhr = new XMLHttpRequest(); 
				else if(window.ActiveXObject){ // Internet Explorer 
				   try {
			                xhr = new ActiveXObject("Msxml2.XMLHTTP");
			            } catch (e) {
			                xhr = new ActiveXObject("Microsoft.XMLHTTP");
			            }
				}
				else { // XMLHttpRequest non supporté par le navigateur 
				   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
				   xhr = false; 
				} 
                                return xhr;
			}
			
			/**
			* Méthode qui sera appelée sur le click du bouton
			*/
			function go(){
				var xhr = getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
						leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('textarea').innerHTML = leselect;
					}
				}

				// Ici on va voir comment faire du post
				xhr.open("POST","ajaxTextarea.php",true);
				// ne pas oublier ça pour le post
				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				// ne pas oublier de poster les arguments
				// ici, l'id de l'auteur
				sel = document.getElementById('OUI');
				valeurOui = sel.options[sel.selectedIndex].value;
				xhr.send("valeurOui="+valeurOui);
				alert("valeurOui="+valeurOui);
			}
		</script>
	</head>
	<body>
		<form>
			<fieldset style="width: 500px">
				<legend>Affichage d'un texarea selon reponse</legend>
				<p>Ma question : </p>
				<input type="radio" name="Q1" id="OUI" value="1"  onchange='go()'/><label>Oui</label>
				<input type="radio" name="Q1" id="NON" value="2" /><label>non</label>
				<br />
				<label>Commentaires : </label><br />
				<div id='textarea' style='display:inline'>
				<textarea disabled=disabled  cols="50" rows="10"></textarea>
				</div>
			</fieldset>
		</form>
	</body>
</html>

page : ajaxTextarea.php

<?php

	if(isset($_POST['valeurOui'])
	{
		if($_POST['valeurOui'] == 1)
		{
			echo '<textarea  cols="60" rows="15"></textarea>';
		}
		else
		{
			echo '<textarea  cols="60" rows="15"  disabled=disabled ></textarea>';
		}
	}
	else
	{
		echo 'Q1 no exsit';
	}

?>

Quelqu'un peut-il m'aider ?

Formulaire ajax

1 réponse

Discussions similaires

Newsletters