1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    3
    Vote Rating
    0
    alighm is on a distinguished road

      0  

    Default numberfield blur listener

    numberfield blur listener


    Hey Guys,

    I am using a numberfield xtype and I have a blur listener defined. What I want to try to do is, inside my blur event, I would want to get the value (name for instance) of another column in my gridpanel (which I have my numberfield defined).

    Code:
    this.grid = Ext.create('Ext.grid.Panel', {                autoScroll: true,
                    height: 300,
                    forceFit: true,
                    store: this.store,
                    viewConfig: {
                        loadMask: false
                    },
    
    
                    // grid columns
                    columns:[{
                        id: "appName",
                        text: "Name",
                        dataIndex: 'name',
                        editor: {
                            allowBlank: false
                        },
                        width: 150
                    },{
                        text: "Memory",
                        dataIndex: 'resources.memory',
                        width: 70,
                        selectOnTab: true,
                        editor: {
                            xtype: 'combobox',
                            allowBlank: false,
                            selectOnTab: true,
                            store: [
                            ['128M','128M'],
                            ['256M','256M'],
                            ['512M','512M'],
                            ['1G','1G'],
                            ['2G','2G']
                            ],
                            lazyRender: true,
                            listClass: 'x-combo-list-small'
                        }
                    },{
                        text: "Instances",
                        dataIndex: 'instances',
                        width: 60,
                        editor: {
                            xtype: 'numberfield',
                            selectOnTab: true,
                            allowBlank: false,
                            step: 1,
                            minValue: 1,
                            maxValue: 19,
                            listeners : {
                                'blur': function(t, ev, b) {
    //                                Ext.getBody().mask("Modifying Instance...");
    //                                $.get("updateInstances/"+)
                                    alert(t.lastValue);
                                },
                                'focus': function() {
                                    console.log('I AM FOCUS');
                                }
                            }
    }
    Now if you look at the code, I want to be able to grab the value of "appName" (the first object inside the grid column) into my blur event on my numberfield.

    Would appreciate any help!!

  2. #2
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,333
    Vote Rating
    85
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    Hi,

    You can try this code:-

    Code:
    Ext.onReady(function () {
    
    
        var grid = Ext.create('Ext.grid.GridPanel', {
            title: 'EditorGrid'
            , renderTo: Ext.getBody()
            , selType: 'cellmodel'
            , plugins: [
                Ext.create('Ext.grid.plugin.CellEditing', {
                    clicksToEdit: 1
                })
            ]
            , height: 200
            , width: 500
            , store: new Ext.data.JsonStore({
                data: {
                    item: [
                            {
                                name: 'xyz'
                                , resourcesmemory: '129M'
                                , instances: '1'
                            },
                            {
                                name: 'abc'
                                , resourcesmemory: '125M'
                                , instances: '12'
                            },
                            {
                                name: 'ttt'
                                , resourcesmemory: '200M'
                                , instances: '2'
                            }
                        ]
                }
                    , fields: ['name', 'resourcesmemory', 'instances']
                    , proxy: {
                        type: 'memory',
                        reader: {
                            type: 'json',
                            root: 'item'
                        }
                    }
            })
                , columns: [
                   {
                       id: "appName",
                       text: "Name",
                       dataIndex: 'name',
                       editor: {
                           allowBlank: false
                       },
                       width: 150
                   },
                    {
                        text: "Memory",
                        dataIndex: 'resourcesmemory',
                        width: 70,
                        selectOnTab: true,
                        editor: {
                            xtype: 'combobox',
                            allowBlank: false,
                            selectOnTab: true,
                            queryMode: 'local',
                            triggerAction: 'all',
                            store: [
                            ['128M', '128M'],
                            ['256M', '256M'],
                            ['512M', '512M'],
                            ['1G', '1G'],
                            ['2G', '2G']
                            ],
                            lazyRender: true,
                            listClass: 'x-combo-list-small'
                        }
                    },
                    {
                        text: "Instances",
                        dataIndex: 'instances',
                        width: 60,
                        editor: {
                            xtype: 'numberfield',
                            selectOnTab: true,
                            allowBlank: false,
                            step: 1,
                            minValue: 1,
                            maxValue: 19,
                            listeners: {
                                'blur': function (t, ev, b) {
                                    var columnData = grid.getSelectionModel().getSelection()[0].data
                                        , value = columnData.name;
                                    alert(value);
                                },
                                'focus': function () {
                                    console.log('I AM FOCUS');
                                }
                            }
                        }
                    } 
                ]
        });
    
    
    })
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    3
    Vote Rating
    0
    alighm is on a distinguished road

      0  

    Default


    This is not a good help. There are a couple of things that I see a issue.
    • Where did the grid object come from?
    • you have hardcoded 0 into the array index. This doesn't seem dynamic to grab the name for different instances.
    I don't think this is a correct solution sword-it

  4. #4
    Sencha User
    Join Date
    Jul 2012
    Posts
    3
    Vote Rating
    0
    alighm is on a distinguished road

      0  

    Default


    OK! So with the great help of my friend Aaron, I was able to resolve the issue.

    In order to get more details about the records of your gridpanel using the CellEditing object, the place I had configured my listener was incorrect!

    Code:
    {
    text: "Instances", dataIndex: 'instances', width: 60, editor: { xtype: 'numberfield', selectOnTab: true, allowBlank: false, step: 1, minValue: 1, maxValue: 19, listeners: { 'blur': function (t, ev, b) { var columnData = grid.getSelectionModel().getSelection()[0].data, , value = columnData.name; alert(value); }, 'focus': function () { console.log('I AM FOCUS'); } }
    }
    You should have the listeners property at the CellEditing object instead:

    Code:
    // editing cell plugin            this.cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
                    clicksToEdit: 1,
                    listeners : {
                        'edit': function(editor, e) {
                            if (e.field == "instances") {
                                Ext.getBody().mask("Modifying Instance...");
                                $.get("updateInstance/" + e.record.get('name') + "/" + e.value, function() {
                                    e.grid.store.load();
                                    Ext.getBody().unmask();
                                });
                            }
                        }
                    }
    });
    This way using
    Code:
    e.record.get(<field-name>)
    you can retrieve the information you need from the column you want!

    I hope the information becomes useful. It sure was for me!!
    Last edited by sword-it; 24 Jul 2012 at 10:05 PM. Reason: code formatting

Thread Participants: 1

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."