Editable cell in a row

Hi,
I hava been lookin for a solution here but no one have worked. But I want is make a cell editable by doing doubleclick on it so I can convert the grid in a form and submit changes.
Can any one help me please?

A (unsanctioned) template such as this might do the trick:


Active.Templates.Input = Active.System.Template.subclass();

Active.Templates.Input.create = function(){

/****************************************************************
Input Cell template.
*****************************************************************/

var obj = this.prototype;
var _super = this.superclass.prototype;

// ------------------------------------------------------------
obj.setTag("div");
obj.setClass("templates", "box");
obj.setClass("box", "item");
obj.setClass("box", function(){return this.getColumnProperty("index")});

// ------------------------------------------------------------
var input = new Active.System.HTML;
input.setClass( "item", "input" );
input.setClass( "input", function(){return this.getColumnProperty("index")} );
input.setTag("input");
input.setAttribute("type","text");
input.setAttribute("value", function() {
return this.getItemProperty("text");
});
input.setEvent("onblur", )
// ------------------------------------------------------------



obj.setEvent( "onblur", function(event, src) { this.onBlurAction( event, src ); } );

obj.onBlurAction = function( event ) {
var name = this.element().name;
var row = this.getRowProperty("index");
var col = this.getColumnProperty("index");
var originalVal = this.getItemProperty("text");
var currentVal = this.element().value;
//alert( "Blurred: "+row+"."+col+": "+currentVal+" from "+originalVal );
if (currentVal!=originalVal) {
this.onChangeAction( currentVal, name, row, col );
}
}

obj.onChangeAction = function( newVal, name, row, col ) {
alert("Changed "+name+" ("+row+":"+col+") to "+newVal );
}


};

Active.Templates.Input.create();

Sorry, submitted the form to soon...


also add the following


obj.setContent( "html", function(){return this.getItemProperty("text");} )

obj.setAction("click", makeEditable );

var makeEditable = function() {
input.setAttribute("type","text");
input.setEvent("onblur", makeUneditable );
this.element().innerHTML=input.toString());
}
var makeUneditable = function() {
input.element().setAttribute("type","hidden");
this.element().innerHTML=this.getItemProperty("text")+input.toString());
}


hopefully that will point you in the right direction

Thank you very much, but does this work?.
I can make it work. When I add your sencond post of code to the HTML stop worlking.
I have noticed this line and I think is an error:
input.setEvent("onblur", )
Could you post a full working example.
Thank you ver much!!!

Write one line of JavaScript that prompts the user to input his name and assigns this value to a variable called user_name. For the prompt text, use "Enter your name below.".