Search code examples
dojox.griddojo

How to Focus inthe First Cell of a Newly-Added Row in a dojox.grid.DataGrid


I am adding a new blank row to a dojox.grid.DataGrid, and want to focus in the first cell of the new row.

I add the row by calling:

var new_row = {},  
attributes = store.getAttributes( items[0] );

dojo.forEach( attributes, function( attribute )
{                   
    dojo.forEach( attributes, function( attribute )
    {
        new_row[ attribute ] = null;
    } );

} );

store.newItem( new_row );

I believe the following code will do the focusing:

grid.focus.setFocusIndex( row_index, 0 );
grid.edit.setEditCell( grid.focus.cell, row_index );

But I cannot figure out how to only call this code after the grid has re-rendered. I guess I need to connect to an event. However, I can't see a likely event to use. onNew() seems to be called before the new row is added.

Here's a JSFiddle which gets as close as I can to a solution. http://jsfiddle.net/xDUpp/ (comment out the line marked edit and it adds the new row)

Thanks


Solution

  • Which version of Dojo are you interested in?

    The Dojo API differs between ver. in this matter.

    Look at: http://jsfiddle.net/keemor/xDUpp/11/

    After store is modified grid needs a little time to rebuild itself, so setFocusIndex & setEditCell must also be delayed to work:

    store.onNew = function( new_item ) {
        var rowIndex = new_item._0;                    
        window.setTimeout(function() {
            grid.focus.setFocusIndex( rowIndex, 0 );
            grid.edit.setEditCell( grid.focus.cell, rowIndex );
        },10);    
    
    };
    

    Greetz