Automatically add a row to grid

I want to be able to add a row to a grid as the user is entering data in the last row. That is when the user presses the tab key in the rightmost column of the last row I want to be able to add a new row to the grid so they can continue to enter data (in the new row).



How can this be done?

You can attach custom code to onEditCell event similar to next

mygrid.attachEvent(“onEditCell”,function(stage,id,ind){
    if (stage==2 && ind == MAX_IND && id == this.getRowId(this.getRowsNum()-1)){
       //last cell of last row
       this.addRow(this.getUID(),"");
       this.selectCell(this.getRowsNum()-1,0);
       this.editCell();
    }
    return true;
})

I tried the event code you provided.  With the event handler attached
to the onEditCell event the tab key no longer works.  That is I can’t
move to the next cell in the table.  Instead the tab key starts cycling
through the fields at the top of Internet Explorer (version 5). 



If I comment out the attachEvent, then the tab key works properly.  Here is the page I am using to test this:




    Test event
   
   
   
   
   


   
   
   
   
   
   





Paul

I noticed there was an extra tag:


   



   

   

   

      <===  Delete this.

   

 
But removing this tag doesn’t fix the problem.

Please check attached sample.
The MAX_IND in snippet above need to be replaced with actual maximum index of column ( 1 in your case )

1216808425.zip (84.6 KB)

Changing MAX_IND to 1 made it work better.  However the selectCell call does not select the first column of the last row in the table, instead it’s the second column.  This is the code (the selectCell code is commented out in the sample.html in the attachment in the previous message):

               this.addRow(this.getUID(),"");
               this.selectCell(this.getRowsNum()-1,0);
               this.editCell();
 
When I click tab in the last column of the last row a new row is added but I am editing the second (last) column not the first column.

Also I can’t find any documentation about the getUID method.  What does this do?  Since the row id needs to be unique for each row, does this method generate a new UID each time it’s called?

I am editing the second (last) column not the first column
The situation is next
a) grid switch first cell of next row to edit mode
b) as reaction on tab key grid moves focus to the next cell
So, to have correct code you may just comment two last commands, or run them through timeout
    this.addRow(this.getUID(),"");
    window.setTimeout(function(){
               grid.selectCell(grid.getRowsNum()-1,0);
               grid.editCell();
    },1);

>>
What does this do?
Just return unique ID ( it based on current timestamp )

>>does this method generate a new UID each time it’s called?
yes, each next call will return unique number