Onclick change text to textbox

My site inventive.webs.com/ad-hoc contains lists of activities. When a user double clicks on an activity, the text will change to textbox, then double click again on the textbox to return to static text, which is so far working properly.

What I want to happen next are:

  1. Textbox must return back to static text when user clicks anywhere on the body.
  2. When there’s an existing textbox, it should return to static text when another activity list is being double clicked.

Can you help me with this one please? I’m new to javascript. :blush:

Here’s my javascript code:

function exchange(el){
var ie=document.all&&!document.getElementById? document.all : 0;
var toObjId=/b$/.test(el.id)? el.id.replace(/b$/,‘’) : el.id+‘b’;
var toObj=ie? ie[toObjId] : document.getElementById(toObjId);

if(/b$/.test(el.id))
toObj.innerHTML=el.value;
else{
toObj.style.width=el.offsetWidth+7+‘px’;
toObj.value=el.innerHTML;
}
el.style.display=‘none’;
toObj.style.display=‘inline’;
}

And here’s my css and html codes:

<style type=“text/css”>
.replace {
display:none;
}
</style>

<span id=“itm1” ondblclick=“exchange(this);”>Activity List here…</span>

<textarea ondblclick=“exchange(this);” id=“itm1b” class=“replace”></textarea>

Thanks in advance!!! :slight_smile:

-Ryezack

You need to attach a ‘clear all’ function to the ‘click’ event of the document. That should reset all textboxes back to their text function first. You would also call the clear all function first in the exchange function, so it resets all the other textboxes, then converts the clicked item to a textbox.

Thanks Mal. I got the concept.

But I don’t know what javascript codes to use and where to put them. The fact is, I just got those codes by google search and I don’t know how to modify them to arrive to my needs.

I would be much help if you could guide me.