CODEWITHSUNDEEP
extjsextjs3concatenation
papski
papski

Reputation: 1281

Concatenate in EditorGridPanel

Inside of my editorGridPanel, I have a three columns. I want to concatenate the data inside of my 'firstname' and 'lastname' column directly going to or when the cursor or focus are now in my 'email address' column in every row. Could someone help me about this problem?

          var cm = new Ext.grid.ColumnModel({

            defaults: {
                sortable: true            
            },
            columns: [{
                    id: 'id',
                    header: 'ID',
                    dataIndex: 'id',
                    width: 220,
                    editable: false,
                    hidden: true
                },
                {
                    id: 'firstname',
                    header: 'First Name',
                    dataIndex: 'firstname',
                    width: 220,

                    editor: new fm.TextField({
                        allowBlank: false                           
                    }),
                    listeners: {


                        click: function(){
                            Ext.getCmp('b_save').enable();
                            Ext.getCmp('b_cancel').enable(); 

                        }                               
                    }
                },
                {
                    id: 'lastname',
                    header: 'Last Name',
                    dataIndex: 'lastname',
                    width: 220,
                    align: 'left',
                    editor: new fm.TextField({
                        allowBlank: false
                    }),
                    listeners: {
                        click: function(){
                            Ext.getCmp('b_save').enable();
                            Ext.getCmp('b_cancel').enable(); 
                        }                               
                    } 
                },
                {
                    id: 'email_address',
                    header: 'Email Address',
                    dataIndex: 'email_address',
                    width: 330,
                    align: 'left',
                    editor: new fm.TextField({
                        allowBlank: false
                    }),
                    listeners: {
                        click: function(){
                            Ext.getCmp('b_save').enable();
                            Ext.getCmp('b_cancel').enable(); 
                        }                               
                    } 
                },






             var grid = new Ext.grid.EditorGridPanel({
                viewConfig: {
                forceFit: true,
                autoFill: true                  

            },
                id: 'maingrid',
                store: store,

                cm: cm,                    

                width: 700,
                anchor: '100%',
                height: 700,

                frame: true,
                loadMask: true,
                waitMsg: 'Loading...',
                clicksToEdit: 2,
                sm : new Ext.grid.RowSelectionModel({
                    singleSelect: true
                    ,onEditorKey : function(field, e) {
                    if (e.getKey() == e.ENTER) {
                    var k = e.getKey(), newCell, g = this.grid,ed = g.activeEditor || g.lastActiveEditor;
                    e.stopEvent();
                    /*ed.completeEdit();*/
                    if(e.shiftKey){
                    newCell = g.walkCells(ed.row, ed.col-1, -1, this.acceptsNav, this);
                    }else{
                    newCell = g.walkCells(ed.row, ed.col+1, 1, this.acceptsNav, this);
                    }
                    if(newCell){
                    g.startEditing(newCell[0], newCell[1]);
                    }
                    }
                    else if(e.getKey() == e.TAB){
                        var k = e.getKey(), newCell, g = this.grid,ed = g.activeEditor || g.lastActiveEditor;
                    e.stopEvent();
                    newCell = g.walkCells(ed.row, ed.col+1, 1, this.acceptsNav, this);
                    if(newCell){
                    g.startEditing(newCell[0], newCell[1]);
                    }
                    }
                    }

                }),
               });

Upvotes: 0

Views: 249

Answers (1)

Akatum
Akatum

Reputation: 4016

You can add concatenated firstname and lastname and set it as value into your email_address field in listener for beforeedit editorgrid event:

listeners: {
    beforeedit: function(e) {
        if (e.field === 'email_address' && e.value === '') {
            var newValue = e.record.get('firstname') + '.' + e.record.get('lastname');
            e.record.set('email_address', newValue);
        }
    }
},

Fiddle with example: https://fiddle.sencha.com/#fiddle/3mf

Upvotes: 1

Related Questions