View Full Version : [CLOSED] Add new row on TAB press in GridPanel Component and normal Column

Dec 23, 2014, 4:27 AM
Hi Daniil,
I am trying to implement the functionality with component column and found a previous forum thread related to this.
I try as per http://forums.ext.net/showthread.php?21924-CLOSED-GridPanel-Next-CellEditor-Status&p=94736&viewfull=1#post94736 but unfortunately not working (a javascript error occurred,but don't understand why ) for me can you please investigate.

can you please let me know,after fix,is this code working for normal grid columns?

Please run the sample.as per previous thread I do it with ENTER key but its good for me if you correct this with TAB key.
run the sample,1st add a row on button click,after 1st row add try to add a new row with key press functionality.

Layout = null;

<!DOCTYPE html>

<meta name="viewport" content="width=device-width" />
<script type="text/javascript">
var addPlant = function () {

var r = Ext.create('pr', {
grid = App.GridPanel;
grid.store.insert(0, r);

.Title("ComponentColumn Editor")
.TopBarItem(Html.X().Button().Text("Add").Listeners(le => { le.Click.Fn = "addPlant"; }).Icon(Icon.Add))
new ModelField("IntField", ModelFieldType.Int)


l.SpecialKey.Handler = @"if (e.getKey() === e.ENTER) {
this.up('gridpanel').enterWasPressed = true;

l.Edit.Handler = @"if (e.grid.enterWasPressed) {
this.startEdit(e.rowIdx + 1, e.column);
e.grid.enterWasPressed = false;




Dec 23, 2014, 5:30 PM
Hi @matrixwebtech,

Implementing this functionality with ComponentColumns I would try not to use the Edit event at all. I would try to add a new row inside the NumberField's SpecialKey handler.

Dec 23, 2014, 5:53 PM
as per your suggestion I do,

l.SpecialKey.Handler = @"if (e.getKey() === e.TAB) {
// this.up('gridpanel').enterWasPressed = true;
this code add add row at first position,but I want to add row after, if no row present after this row where I press TAB.

I add
grid.store.insert(grid.getStore().getCount()+1, r); to addPlant() and I am able to do this.but also one thing still remaining.
how I set focus to first component of new created row.

Dec 26, 2014, 9:02 AM
I am waiting for a reply for http://forums.ext.net/showthread.php?49382-Add-new-row-on-TAB-press-in-GridPanel-Component-and-normal-Column&p=222831&viewfull=1#post222831

Dec 26, 2014, 9:18 AM
Apologize for the delay.

Please try:

App.ComponentColumn1.getComponent(indexOfNewRow).f ocus();