Edit Cell on Selection, not on DoubleClick

Hi all,

How do I edit cells upon selecting them? I would like to either click on a cell or navigate to it with enter/tab/arrow keys and have it immediately go into Edit mode.

I know how to turn off the double-click:

// turn off double-click
obj.onCellDoubleClicked = function(event, col, row) {
    return true; // cancels further processing
}

and I've seen the controllers in _cell.js and _singlecell.js, but have no idea how to do this, as these are all private or internal methods. In _singlecell.js, I see the cellMouseDown controller set to 'selectThisCell' but could I also have it 'editCurrentCell' as well? I would prefer not to mess with Alex's source code, so should I create my own controllers for selection and navigation and use that? Sounds somewhat tedious for this task, but if it's the way to go...

Thanks

One "easy-way" alternative could be:

obj.setCellEditable(false);	
var MyInput = new AW.UI.Input; 

var lastcol="";
var lastrow="";
var defaultcelltemplate = obj.getCellTemplate(0,0);

obj.onCellClicked = function(event, col, row){ 
obj.setCellTemplate(defaultcelltemplate, lastcol, lastrow);
obj.getCellTemplate(lastcol, lastrow).refresh();
obj.setCellTemplate(MyInput , col, row);
obj.getCellTemplate(col, row).refresh();
lastcol = col;
lastrow = row;
}

And you can also do it for an entire row:

obj.setCellEditable(false);	
var MyInput = new AW.UI.Input; 

var lastcol=0;
var lastrow=0;
var defaultcelltemplate = obj.getCellTemplate(0,0);
var NrColumns = obj.getColumnCount()

obj.onCellClicked = function(event, col, row){ 

for(var x=0; x< NrColumns; x++) {
obj.setCellTemplate(defaultcelltemplate, x, lastrow);
 obj.getCellTemplate(x, lastrow).refresh();
 }
 
 for(var x=0; x< NrColumns; x++) {
obj.setCellTemplate(MyInput, x, row);
 obj.getCellTemplate(x, row).refresh();
}

lastcol = col;
lastrow = row;
}

Carlos,

Thanks for the reply. It is almost what I need... I can click and the cell template changes to the AW.UI.Input template (which I will need anyway, to customize the onKeyXXX events that I want to do later).

I then moved on to attempting to get the same behavior when double-clicking, namely that the text in the cell gets the focus and is selected.

obj.setCellEditable(false);    
    var editor = new AW.UI.Input;  // editor cell template
    var cell = obj.getCellTemplate(0,0);  // default cell template
    
    var lastcol="";
    var lastrow="";
    
    obj.onCellClicked = function(event, col, row) {
        // no editing for cols 0 & 1
        if(col > 1) {

            this.$edit = false;
            obj.setCellTemplate(cell, lastcol, lastrow);
            obj.getCellTemplate(lastcol, lastrow).refresh();
            
            
            obj.setCellTemplate(editor, col, row);
            obj.getCellTemplate(col, row).refresh();

            var text = editor.element().getElementsByTagName("input")[0];
            this.$edit = true;
            this.timeout(function(){
                text.focus();
                text.select();
                text = null;
            });
            
            lastcol = col;
            lastrow = row;
        }
    }

This works as well, in Firefox 1.0.6 on Gentoo Linux. However, the entire browser segfaults when I attempt to type just one letter (should replace the selected text with the new letter). Even if it is a bug in Firefox, I'll need to find a different way to do this in AW. On IE, the text is not selected, and the cursor blinks at the beginning of the cell text.

Couple more things.
a. I am using this.$edit, but am not sure I have access, or what the effect is.
b. Is there a way to call the edit() method that I see in _cell.js - to use Alex's code or at least inherit from it? That way I don't have to duplicate all the adequate editor code.

Thoughts?

A bit more info...

On Firefox 1.0.4 on Windows, there is no segfault.

Also, on all platforms and browsers, the first key will put a character in the input box, but subsequent ones do not show up. I need to be in "edit" mode, where keys pressed are reflected in the input box.

This will select all text in the text box
where editor is the name of the AW.UI.Input control

editor.setTimeout(function()					
{ editor.startEdit(); });