Ajax : Récupération valeurs dans un input

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Ajax : Récupération valeurs dans un input

par joss91 » 27 janv. 2008, 20:15

avec le onload cela ne marche pas... mais je pense que ce probleme sera résolu : je vais le contourner en gardant en memoire la valeur selectionneée dans ma liste déroulante après rafraichissement et par un if qui test si mon input est vide ou pas :wink:

par Calimero » 26 janv. 2008, 17:28

Cependant j'ai un dernier petit souci : le contenu de l'input n'aparait pas tout de suite lorsque ma page s'ouvre... il faut que je selectionne qqchoz dans ma liste déroulante pour que cela fasse apparaitre mes valeurs. Alors qu'avec la méthode div cela apparait dès le chargement de la page... ?? :?
Il te reste un dernier truc à comprendre dans ton code : ton code ajax se présente sous la forme d'une fonction javascript (sendData).

Une fonction ne fera rien du tout tant qu'elle n'est pas appelée par ton code. Il y a deux façons d'appeler une fonction javascript : soit directement, soit dans un évènement.

Dans ton cas, la fonction est appelée sur les évènements onkeyup (= si touche relâchée) et onchange (= si valeur modifiée) de ta balise select, donc la liste déroulante. Ce qui explique ce comportement.

Si tu veux que la fonction soit appelée au chargement de la page il faut écrire l'appel qui va bien...

par joss91 » 23 janv. 2008, 14:04

Ok j'ai reussi à récupérer les valeurs dans l'input merci ! Mais pour info je comprends mon code sauf que je n'ai eu l'idée de transfromer .hinnerHTML en .value...! :wink:
Merci encore c cool ! :D

Cependant j'ai un dernier petit souci : le contenu de l'input n'aparait pas tout de suite lorsque ma page s'ouvre... il faut que je selectionne qqchoz dans ma liste déroulante pour que cela fasse apparaitre mes valeurs. Alors qu'avec la méthode div cela apparait dès le chargement de la page... ?? :?

par Calimero » 23 janv. 2008, 12:51

Bonjour,
C'est juste un probleme php/html je pense !
Non, c'est un problème de javascript et Ryle t'a donné une bonne partie de la solution. :)

Tu n'as pas le choix, il faut que tu comprennes le script Ajax que tu as récupéré (on ne modifiera pas à ta place un script que tu utilises sans l'avoir compris) et que tu le modifies pour coller à ton besoin. Il y a très exactement deux lignes à modifier dedans pour arriver à ton but :

- La partie qui identifie l'élément HTML cible, par son id (il faut juste changer l'id...).
- La partie juste après, qui spécifie comment écrire dans cette balise (dans le cas d'un div, on écrit dans la propriété innerHTML. Dans le cas d'un input text, on écrit dans la propriété value).

Essaye, et dis-nous si tu as des problèmes, on t'aidera. 8-)

par joss91 » 23 janv. 2008, 11:51

Avec ou sans les trois petits points ? :wink:
... sans les trois petits points évidement :roll: fo pas pousser !

Bref pour répondre à ceux qui se pose la question sur le fonctionnement de mon code (qui marche bien je me répète !!) :
J'ai récupéré un code qui fais afficher dans une liste déroulante des valeurs d'une table de ma base. Suivant cette valeur selectionnée dans cette liste, cela affiche une autre valeur de ma table dans un <div id=contenu> (voir mon code plus haut).

mon probleme est simple : Je veux que cette valeur ne soit pas dans le div (car inexploitable) mais dans un endroit bien précis (mon input). Ce input se trouve dans une page où je vais inclure tout mon ajax. Maintenant je n'arrive pas à faire arriver la valeur contenue dans le div dans mon input...
C'est juste un probleme php/html je pense !

par dogmongo » 23 janv. 2008, 10:56

Bonjour,

En gros tu veux créer un système de navigation entre divers catégorie ?

Après avoir examiné ton code ton problème ce situ au niveau PHP, tu ne peu pas t'amuser à modifier une requête qui à déjà été faite.

Peu être devrais tu mettre les données de la deuxieme requete PHP de ta page index en tableau :!:

puis les réutiliser à ta guise, ensuite peu être que tu pourra trouver une solution pour générer une autre liste avec les nouveaux choix venus de ton autre page PHP.

j'irai même plus loin je récupère mes données de la requête, je les envois en variable chaine avec l'Ajax et je remanie tout ca sur l'autre page qui va pouvoir générer un nouveau <div contenu.. Complet

par Invité » 23 janv. 2008, 01:51

peut etre dire une connerie (bartez style)

echo "</select>";
il n est ouvert nulle part non !!!
:lol:

par Berzemus » 23 janv. 2008, 00:11

Avec ou sans les trois petits points ? :wink:

par joss91 » 22 janv. 2008, 19:41

en fait le div ne m'interesse pas en lui meme c'est le input : il faut que la valeur du div arrive dans mon input. J'ai rappatrié un code en ajax qui me créé un div alor que je veux que ce soit un input de ma page qui recoive la valeur...
J'ai testé avec

Code : Tout sélectionner

document.formulaire.input.value = document.getElementById('...').innerHTML
cela ne marche pas

par Ryle » 22 janv. 2008, 18:13

Euh non, effectivement, c'est moi qui ne voit pas bien ce que tu veux faire... tu récupères une valeur avec ajax et tu veux la mettre à la fois dans un div et dans un input ?

Pour lire (ou modifier) le contenu d'un bloc (donc d'un div) on utilise la propriété innerHTML : monBloc.innerHTML = '...' (ou monBloc est un objet du style document.getElementById('...'))
Pour un input, on utilise monInput.value = '...' (ou monInput est du style document.formulaire.input)

Tu peux donc passer la valeur de l'un dans l'autre, si c'est ce que tu essayes de faire :
document.formulaire.input.value = document.getElementById('...').innerHTML
C'est bien ça que tu voulais ?

par joss91 » 22 janv. 2008, 17:46

?? Je n'ai pas trop compris Ryle je ne suis pas sur qu'on se comprenne (ou c'est peut etre, voir probablement, moi qui ne comprends pas...!) : ma valeur que je récupère est dans

Code : Tout sélectionner

<div id="contenu">
et je possède un input autre part qui aimerais bien recevoir ce qu'il y a dans le div...
Si je résume, tu penses en passant par

Code : Tout sélectionner

document.getElementById('id_cible').value=document.getElementById('id_récupéré').value
cela peut marcher ?

par Ryle » 22 janv. 2008, 17:10

Pour modifier la valeur d'un input de type text, on utilise
document.nom_du_formulaire.nom_de_input.value = 'valeur_a_donner';
// ou si tu passe par l'id de l'input :
document.getElementById('id_de_input').value = 'valeur_a_donner';
Tu ne devrais pas avoir trop de difficulté a modifier/compléter ton code pour écrire dans un input au lieu d'un div ;)

Ajax : Récupération valeurs dans un input

par joss91 » 22 janv. 2008, 17:01

Bonjour,

Voila j'utilise la méthode ajax pour récupérer des valeurs dans ma base via une liste déroulante. C'est à dire que suivant le choix fait dans ma liste déroulante une requete est lancée pour me donner des valeurs de ma base directement. Cela fonctione bien mais le probleme c'est que ces valeurs sont récupérées dans un div alors que j'aimerais les avoir dans un input text...! j'ai essayé diverses choses mais je n'y arrive pas il ne veut que le div :x

Voici la partie du code coté index.php (le div en question est à id="contenu") :
<html>
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script type="text/javascript">
	/**
	 * Permet d'envoyer des données en GET ou POST en utilisant les XmlHttpRequest
	 */
	function sendData(param, page)
	{
		if(document.all)
		{
			//Internet Explorer
			var XhrObj = new ActiveXObject("Microsoft.XMLHTTP") ;
		}//fin if
		else
		{
		    //Mozilla
			var XhrObj = new XMLHttpRequest();
		}//fin else

		//définition de l'endroit d'affichage:
		var content = document.getElementById("contenu");
		
		XhrObj.open("POST", page);

		//Ok pour la page cible
		XhrObj.onreadystatechange = function()
		{
			if (XhrObj.readyState == 4 && XhrObj.status == 200)
				content.innerHTML = XhrObj.responseText ;
		}

		XhrObj.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
		XhrObj.send(param);
	}//fin fonction SendData

    </script>
</head>
<body>

<?php
   // Paramètres de la Connexion à la base MYSQL
   $user="root";
   $host="localhost";
   $password="";
   $database="mediateczrecall";
   $i=0; // variable de test
   $j=0; // variable pour garder la valeur du premier enregistrement catégorie pour l'affichage
       
   $connexion = mysql_connect($host,$user,$password) or die ("Connexion au serveur impossible");
    
   mysql_select_db($database,$connexion);
    
   // Séléction de tous les enregistrements de la table Catégorie
   $rq="Select * from client where id_cabinet='0' order by id;";
   $result= mysql_query ($rq) or die ("Select impossible");
   echo "<form method='POST' action='valid.php'>";?>   <select size="1" name="cat" OnChange="sendData('id='+this.value,'liresc.php')" onKeyUp="sendData('id='+this.value,'liresc.php')">

<?php
	
   while ($dt=mysql_fetch_row($result))
   {
    // Remplir la liste déroulante des catégorie	
	echo "<option value=".($dt[0]).">".($dt[1])."</option>";
    if ($i==0) { $j=$dt[0]; $i=1; } // garder la valeur du premier enregistrement
   }
    
   ?>    
   </select><br><br>
   

	Appuyer sur OK pour confirmer cette utilisateur :
   <div id="contenu">
 <?php  
  // affichage des sous-catégorie appartenant à la première catégorie.
   //echo "<input size='1' name='souscat'>";   
    $rq="Select * from client where id=".$j." order by id;";
    $result= mysql_query ($rq) or die ("Select impossible");
     // $i = initialise le variable i
    $i=0;
    while ($dt=mysql_fetch_row($result))
    { 
	 echo "<option value=".utf8_encode($dt[0]).">".utf8_encode($dt[12])."</option><br>";
	  echo "<option value=".utf8_encode($dt[0]).">".utf8_encode($dt[13])."</option><br>";
    }    
	echo "</select>";
   ?>   
   </div>
</form>
</body>
</html>

Et voici le code coté liresc.php :

<?php
header('Content-type: text') ; // on déclare ce qui va être afficher
 
// test des POST emis
if(isset($_POST['id']) && !empty($_POST['id']) ){
   $user="root";
   $host="localhost";
   $password="";
   $database="mediateczrecall";
   $connexion = mysql_connect($host,$user,$password) or die ("Connexion au serveur impossible");   
   mysql_select_db($database,$connexion);
    $rq="Select * from client where id=".$_POST['id']." order by id;";
    $result= mysql_query ($rq) or die ("Select impossible");
     // $i = initialise le variable i
    $i=0;
	if (mysql_num_rows($result)>0)
	{
	  //echo "<input size='1' name='souscat'>";
	}
	else
	{
	  echo utf8_encode("Pas de sous catégories disponible");	
	}
    while ($dt=mysql_fetch_row($result))
    { 	
	 echo "<option value=".utf8_encode($dt[0]).">".utf8_encode($dt[12])."</option><br>";
	 echo "<option value=".utf8_encode($dt[0]).">".utf8_encode($dt[13])."</option><br>";
    }    
	echo "</select>";
}

?>


J'arrive pas à m'en sortir ! Merci d'avance pour vos suggestions :wink: