Page 1 sur 1

Retourner variable js dans champs texte d'un formulaire

Posté : 08 juin 2007, 11:37
par mazou
Bonjour,

Je bosse sur une page qui permet de positionner des éléments sur une page.
J'arrive à récupérer la position de l'élément (x ou y), mais j'aimerai qu'elle s'affiche sur la page dans un champ texte de formulaire, en temps "réel", que ce champ texte s'actualise automatique dès qu'il la variable change.

En mettant ceci, je retourne la variable, mais elle ne s'actualise pas :

Code : Tout sélectionner

<script type="text/javascript"> document.write('<input type="text" name="x" size="20" value="' +x+ '"></input>') </script>
Pourriez-vous m'aider à faire cela ?

Merci d'avance

Posté : 08 juin 2007, 16:47
par Ryle
En fait, dans le code ci dessus, tu définies ton champ et sa valeur en dur. Pour la modifier dynamiquement, il faut la modifier en javascript :
<input type="text" name="x" size="20" value="">

<script type="text/javascript"> 
function updateX (valeur) {
  document.nom_du_formulaire.x.value = valeur;
}
</script> 
Ainsi il suffit d'appeller la fonction updateX() en lui passant la nouvelle valeur de X pour que le champ soit mis à jour. A toi de voir ensuite à quel moment cette fonction doit être appellée. Cela peut être lors d'un événement (un clic, une touche, déplacement de la souris ...) ou même à interval régulier.. bref à toi de voir :)

Posté : 11 juin 2007, 11:39
par mazou
Bonjour,

Merci pour ta réponse, mais je n'arrive (pour l'instant) pas à la mettre en oeuvre.
Voici, donc le résultat de la modification :
<form id="form1" name="form1" method="post" action="">

	<div id="boxDrag" class="box">
		<p>Ma box pour test</p>
	</div>	
<script language="JavaScript">
var x =document.getElementById("boxDrag").offsetTop;
 var y =document.getElementById("boxDrag").offsetLeft;

function updateX (valeur) {
  document.form1.testX.value = valeur;
}
</script>
         <input type="text" name="testX" value="" style="width: 40px;" onKeyPress="return updateX(x);">
 </form>
Hélàs le champ reste toujours vide !

Une idée ?

Merci

Posté : 12 juin 2007, 15:09
par [Sébastien]
Salut, c’est un peut difficile de t’aider, car ton code ne colle pas. Si je te suis tu veux récupérer la position d’un élément au déclenchement de l’événement onkeypress et ainsi les assigners comme valeur à un champ text c’est ça ?

Posté : 12 juin 2007, 16:39
par mazou
J'ai fini par y arriver, il suffisait de mettre la fonction afficherCoordonnees() dans un monmousemove() dans un div.

Par exemple :

Code : Tout sélectionner

<script language="JavaScript"> function afficherCoordonnees() { document.getElementById('y').value = document.getElementById("lot1").offsetTop; document.getElementById('x').value = document.getElementById("lot1").offsetLeft; } //--> </script><input type="hidden" id="y" name="y" "/> <input type="hidden" id="x" name="x" /> <div class="plan" onmousemove="afficherCoordonnees();"> Le contenu... </div>
J'ai contourner le problème en fait...