Discussion :

[cramo]

J'expose mon problème :
Je souhaiterai pouvoir modifier la valeur d'un lien situé sur une page.
Pour cela, lorsque je clique sur le lien, un input texte apparait ce qui permet de donner la nouvelle valeur. Jusque là pas de problème.
Puis lorsque la boite perd le focus je souhaiterai revenir dans l'état initial.
Le problème vient du fait que lorsque je perds le focus de la boite la valeur du lien change bien mais l'evenement qui lui est lié ne fonctionne pas, impossible de modifier 2 fois de suite la valeur ce qui pose problème.

Voici le bout de code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script language="javascript" type="text/javascript">
function chang(val){
 var nb=document.getElementById(val).firstChild.firstChild.data;
 var newInput = document.createElement('input');
 newInput.type = 'text';
 document.getElementById(val).removeChild(document.getElementById(val).firstChild);
 document.getElementById(val).appendChild(newInput);
 document.getElementById(val).firstChild.value=nb;
 document.getElementById(val).firstChild.focus();
 document.getElementById(val).firstChild.addEventListener("blur",function(){ 
  var nb=document.getElementById(val).firstChild.value;
  newInput = document.createElement('a');
  var t=document.createTextNode(nb);
  document.getElementById(val).removeChild(document.getElementById(val).firstChild);
  document.getElementById(val).appendChild(newInput);
  document.getElementById(val).firstChild.appendChild(t);
  document.getElementById(val).firstChild.addEventListener("click",chang,true);
 },true);
</script>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<?php
echo "<tr><td id=\"test\"><a href=\"javascript:; \"onClick=\"chang(this.parentNode.id);\">coordonnées</a></td></tr>";
?>

Si quelqu'un à une idée de l'endroit où se situe le problème, je suis preneur

merci d'avance

[le_chomeur]

a première vue l'erreur viendrais d'ici :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
href=\"javascript:; \"onClick=\"chang(this.parentNode.id);\"

en code généré tu va avoir :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

href="javascript:; "onClick="chang(this.parentNode.id);"

il te faudrait :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

href="chang(this.parentNode.id);return false";

[cramo]

J'ai réussi à résoudre mon problème, pour ceux que ca interesse, voici une solution :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function modifieTexte(id) {
		var elt = document.getElementById(id);
		var val = elt.firstChild.nodeValue;
		var nvElt = document.createElement('input');
		nvElt.type = 'text';
		nvElt.value= val;
		elt.removeChild(elt.firstChild);
		elt.appendChild(nvElt);
		elt.firstChild.focus();
		elt.firstChild.addEventListener("blur",function(){ 
			var val2=elt.firstChild.value;
			var nvElt2=document.createTextNode(val2);
			elt.removeChild(elt.firstChild);
			elt.appendChild(nvElt2);
			elt.firstChild.addEventListener("click", function() { modifieTexte(id);}, false);
		},false);
	}
 
function load() {
		for(i=1;i<=3;++i){
			document.getElementById("t"+i).addEventListener("click", function() { return modifieTexte(this.id);}, false);
		}
	}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<table id="t"> 
   <tr><td id="t1">un</td></tr> 
   <tr><td id="t2">deux</td></tr>
   <tr><td id="t3">trois</td></tr> 
 </table>