Forum SELFHTML  Archives du forum  2007  juillet

	Forum SELFHTML: Archives: Champs texte et mise à jour valeur
	(JAVASCRIPT) Champs texte et mise à jour valeur  (JAVASCRIPT) Champs texte et mise à jour valeur  (JAVASCRIPT) Champs texte et mise à jour valeur

(JAVASCRIPT) Champs texte et mise à jour valeur

Le message suivant est de: iManuel,  inxtense@free.fr, 02. 07. 2007, 13:08

Bonjour,

Je cherche à récupérer la valeur d'un champs texte 'INPUT' modifié à la volée. Le problème rencontré est que je n'arrive pas a récupérer autre chose que le texte original.

Code HTML
********
<span id="text2edit" onmouseup="afficheInput('text2edit')">cliquer sur ce texte pour le modifier</span>
********

Javascript :
********
function updateInput(idModifIt) {
 var elem = document.getElementById(""+idModifIt+"");
 var text2Update = elem.getAttribute('value');
 alert(text2Update);
}

function afficheInput(id) {
 var elem = document.getElementById(id);
 var texte = elem.innerHTML;

 var testInput = elem.firstChild.nodeName;
 var idModifIt = "modifIt";
 if (testInput!='INPUT') {
  elem.innerHTML = "<input id=\""+idModifIt+"\" type=\"text\" value=\""+texte+"\">";
 } else {
  elem.removeAttributeNode(elem.attributes[1]);
  elem.setAttribute("onkeyup","updateInput('"+idModifIt+"');");
 }
********

Avez-vous une idée ??

Manu

(JAVASCRIPT) Champs texte et mise à jour valeur

Le message suivant est de: iManuel,  inxtense@free.fr, 02. 07. 2007, 14:50

Mise à jour de mon code, finalement, ça fonctionne :

*******
<span id="text2edit" onmouseup="afficheInput('','text2edit','','2input');">cliquer sur ce texte pour le modifier</span>
*******

Code Javascript
*******
function afficheInput(valeur,idSpan,idInput,change) {
 var elem = document.getElementById(idSpan);
 var texte = elem.innerHTML;
 //
 var idInput = "modif_"+idSpan;
 if (change=="2input") {
  elem.setAttribute("onmouseup","void();");
  elem.innerHTML = "<input id=\""+idInput+"\" type=\"text\" value=\""+texte+"\" onblur=\"return afficheInput(this,'"+idSpan+"','"+idInput+"','2span')\">";
 } else {
  elem.setAttribute("onmouseup","afficheInput('','"+idSpan+"','"+idInput+"','2input');");
  elem.innerHTML = valeur.value;
 }
}
*******

reste un petit problème quand au Blur, il faut cliquer dans la case, puis à l'extérieur si on ne désire pas modifier le texte .. je vais tester avec d'autres evenements  :) :)

Manu

(JAVASCRIPT) Champs texte et mise à jour valeur

Le message suivant est de: iManuel,  inxtense@free.fr, 02. 07. 2007, 15:01

Dernière version :

HTML
*****
<span id="text2edit" onmouseup="afficheInput('text2edit','2input');">cliquer sur ce texte pour le modifier</span>
*****

JS
*****
function afficheInput(idSpan,change,valeur) {
 var elem = document.getElementById(idSpan);
 var texte = elem.innerHTML;
 if (texte == '[vide]') { texte = "Saisir un texte"; }
 //
 var idInput = "modif_"+idSpan;
 if (change=="2input") {
  elem.setAttribute("onmouseup","void();");
  elem.innerHTML = "<input id=\""+idInput+"\" type=\"text\" value=\""+texte+"\" onblur=\"return afficheInput('"+idSpan+"','2span',this)\">";
 } else if (change=="2span") {
  elem.setAttribute("onmouseup","afficheInput('"+idSpan+"','2input');");
  var texteUpdate = valeur.value;
  if (texteUpdate=='') { texteUpdate = "[vide]"; }
  elem.innerHTML = texteUpdate;
 }
*****

 :)

Forum SELFHTML  Archives du forum  2007  juillet

© 1998-2004  selfhtml@fr.selfhtml.org