Forum Clubic

Javascript: recuperation valeur du formulaire et AJAX

bonjour,

j ai un formulaire avec des input type text et des select.

j ai donc fait ceci sur le champ ou je voulais faire de l’AJAX:


<input name="ref" type="text" maxlength="200" value="" ><INPUT TYPE="button" VALUE="Référence Interne" onclick="generationrefinterne(document.getElementById('marque').value,document.getElementById('designation').value,document.getElementById('type').value,document.getElementById('etat').value)">

De plus la fonction va ici:


<head>
<script type="text/javascript">
function generationrefinterne(marque,designation,type,etat)
	{
	alert(marque);
	alert(designation);
	alert(type);
	alert(etat);
	var champs="ref";
	texte = file('referencement.php?designation='+designation'&marque='+marque'&type='+type'&etat='+etat');
	document.getElementById(champs).value = texte;
	}	
</script>
</head>

Or ca ne fonctionne pas du tout…il dit “objet attendu”

qu en pensez vous?

merci davance

normal.

document.getElementById() == récupère un élément dont l’attribut id a été défini. Là, tu n’as que name.

dans tous les champs marque,designation type et etat j ai definit pour chacun un id du meme nom pourtant

par ex:

c’est une erreur comme j ai fait?

file('referencement.php?designation='+designation+'&marque='+marque+'&type='+type+'&etat='+etat);

Déjà il yavait un problème de concaténation, quand tu sors d’une chaine de caractère, il faut que ta variable soit entourer par le + de la concaténation.

edit : si ca ne marche toujours pas, penche toi du côté de ta fonction file();
Edité le 07/12/2007 à 09:35

J’espère que ta fonction file n’est pas la fonction php du même nom… car si c’est ça, tu te trompe complètement de contexte :slight_smile:

Bonjour
voici la partie qui ne fonctionne pas avec ce que je veux faire:

la mise à jour d’un menu déroulant


<head>
<script type="text/javascript">
function recherche_marque(marque)
	{
	
	var champs="type";
	texte = file('recherche_marque.php?marque='+marque);
	document.getElementById('type').innerHTML = texte;
	}	
	
function file(fichier)
	{
	if(window.XMLHttpRequest) // FIREFOX
	xhr_object = new XMLHttpRequest();
	else if(window.ActiveXObject) // IE
	xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
	else
	return(false);
	xhr_object.open("GET", fichier, false);
	xhr_object.send(null);
	if(xhr_object.readyState == 4) return(xhr_object.responseText);
	else return(false);
	}
</script>
</head>	

dans le fichier recherche_marque, je renvoi echo data[‘type_article’] présent dans la boucle while de la requete sur la base de données qui contient tous les articles qui correspondent a la marque rentrée

mais rien ne se passe! (et pas d’erreur non plus)

je pense que j ai déjà un problème dans la page recherche_marque.php je dois pas envoyer ce qu il faut. De plus je suis pas sur du code qui permet de mettre a jour le menu déroulant “type”

qu’en pensez vous?

Je précise que ce code fonctionne sans problème (sans le innerHTML bien sur) dans le cas d’un champ input type text classique.

merci d’avance

Je pense qu’il faut que tu installes Firebug sur Firefox, tu verras c’est un vrai bonheur, tu pourras voir ce qui rentre et sort de tes applets ajax.

Pour tester ton script recherche_marque.php, attribut lui une marque par défaut et lance le directement dans la navigateur. SI ca se trouve il est tout bugged.

Et desfois que tu n’aurais pas lu mon message précédent, tu faisais des erreurs de concaténation dans ta fonction file();

@+

Oh mais j’ai une partie de la réponse à son problème :slight_smile:

AJAX = Asynchrone.

Donc si tu veux, tu ne peux pas faire ce que tu fais :

function file(fichier)
	{
	if(window.XMLHttpRequest) // FIREFOX
	xhr_object = new XMLHttpRequest();
	else if(window.ActiveXObject) // IE
	xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
	else
	return(false);
	xhr_object.open("GET", fichier, false);
	xhr_object.send(null);
	if(xhr_object.readyState == 4) return(xhr_object.responseText); // -- si asynchrone, ne renverra jamais rien
	else return(false);
	}

Ce pour deux raisons :

  1. Je pense que tu es en synchrone (le troisième paramètre doit valoir true pour de l’asynch)
  2. Mais tu dois utiliser un handler -> developer.mozilla.org…

dc ca voudrait dire qu le code peut marcher en input type texte mais pas pour des manue deroulant?

Si. Mais pas comme ça :slight_smile:

Lis la doc que je t’ai filé, et réfléchis de manière asynchrone.

vous allez rire:

en faisant d’autres essais j en suis arrivé la:


<script type="text/javascript">
function recherche_marque(marque)
	{
	
	var champs="type";
	texte = file('recherche_marque.php?marque='+marque);
	document.getElementById('type').innerHTML = texte;
	}	
	
function file(fichier)
	{
	if(window.XMLHttpRequest) // FIREFOX
	xhr_object = new XMLHttpRequest();
	else if(window.ActiveXObject) // IE
	xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
	else
	return(false);
	xhr_object.open("GET", fichier, false);
	xhr_object.send(null);
	if(xhr_object.readyState == 4) 
		return(xhr_object.responseText);
	else return(false);
	}
</script>

dc le code toujours en synchrone

puis mon fichier recherche_marque.php:


include 'connexion.php';
$sql_marque="SELECT DISTINCT(type_article) FROM articles WHERE marque_article='".$_GET['marque']."' ORDER BY marque_article ASC";
$req_marque = mysql_query($sql_marque); 
while($data_marque = mysql_fetch_array($req_marque))
	{
	echo "<option value='".$data_marque['type_article']."'>".$data_marque['type_article']."</option>";
	}

et enfin le formulaire:


Type Matériel :</td><td>
<select name="type" id="type"><option></option>
</select>

eh ben code fonctionnement parfaitement…sous FF.
Par contre IE rien ne marche

Encore une fois, je pense pas que le comportement soit le bon :

function recherche_marque(marque) {
if(window.XMLHttpRequest) // FIREFOX
	xhr_object = new XMLHttpRequest();
	else if(window.ActiveXObject) // IE
	xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
       else return false;
	xhr_object.open("GET", fichier, false);
	xhr_object.send(null);
	xhr_object.onreadystatechange = function() {
  if (this.readyState == 4) {
    document.getElementById('type').innerHTML = xhr_object.responseText;
  } 
};
return true;}

Et à priori, il faudrait désactiver l’objet qui a lancé l’événement histoire d’éviter trop de requêtes.

pourtant selon la doc tout devrait fonctionner car a part le true c’est la seule différence apparente

Eventuellement, fournis nous une page d’exemple.