1. #1
    Sencha User
    Join Date
    Dec 2007
    Posts
    11
    Vote Rating
    0
    twist3r is on a distinguished road

      0  

    Question Unanswered: ExtJS 4.1: How to allow ENTER key to be pressed in TextArea EditorGrid?

    Unanswered: ExtJS 4.1: How to allow ENTER key to be pressed in TextArea EditorGrid?


    hello,

    I've defined an EditorGrid in ExtJS 4.1-RC1 and one of the columns has a TextArea as editor.

    When pressing the ENTER key to enter e newline in the textarea the grid intercepts the event and fires the completeEdit() event, closing the editor and commiting the changes.

    How can I avoid this behavior and allow newlines to be entered?

    This is the column definition:

    Code:
    {
          dataIndex: 'note',
          text: 'Note',
          width: 120,
          sortable: false,
          filterable: true,
          editor: {
            xtype: 'textarea',
            allowBlank: true,
            grow: true,
            completeOnEnter: false,
          },
        }
    note that the "completeOnEnter" option seems to have no effect

    Thanks for any reply.

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,652
    Vote Rating
    901
    Answers
    3575
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    This for cell or row editing?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Dec 2007
    Posts
    11
    Vote Rating
    0
    twist3r is on a distinguished road

      0  

    Default


    Quote Originally Posted by mitchellsimoens View Post
    This for cell or row editing?
    RowEditing

  4. #4
    Sencha User
    Join Date
    Apr 2012
    Posts
    1
    Vote Rating
    0
    MrNicholas is on a distinguished road

      0  

    Default


    twist3r,

    I was having this exact same issue and came across your post. After about two hours of digging thru the various sources, I finally came up with a solution (though it may not be optimal).

    The "submit on enter" functionality is setup in the afterRender event of Ext.grid.RowEditor. I created a simple override to remove it:

    Code:
    Ext.override(Ext.grid.RowEditor, {
       afterRender: function() {
            var me = this,
                plugin = me.editingPlugin;
    
            me.callParent(arguments);
            me.mon(me.renderTo, 'scroll', me.onCtScroll, me, { buffer: 100 });
    
            // Prevent from bubbling click events to the grid view
            me.mon(me.el, {
                click: Ext.emptyFn,
                stopPropagation: true
            });
    
            me.el.swallowEvent([
                'keypress',
                'keydown'
            ]);
    
            me.keyNav = Ext.create('Ext.util.KeyNav', me.el, {
                esc: plugin.onEscKey,
                scope: plugin
            });
    
            me.mon(plugin.view, {
                beforerefresh: me.onBeforeViewRefresh,
                refresh: me.onViewRefresh,
                scope: me
            });
        }
    });
    In the keyNav setup block, it used to have the following:
    Code:
    enter: plugin.completeEdit,
    which is the thing I removed. This is for 4.0.6, btw, not 4.1 but since no one had responded to you, I thought I'd share.

    Enjoy!

  5. #5
    Touch Premium Member
    Join Date
    Sep 2011
    Posts
    47
    Vote Rating
    1
    Answers
    1
    ruslan.talpa is on a distinguished road

      0  

    Default


    This seems to work for me
    PHP Code:
    {
        
    xtype'gridcolumn',    
        
    dataIndex'description',   
        
    editor: { 
            
    xtype'textareafield',
            
    listeners: { 
                
    afterrender: function(){
                    var 
    me this;
                     
    me.el.swallowEvent(['keypress','keydown'    ]); 
                }
            }
        }