如何從網格（彈出）將值發送到extjs中的表單面板

Question

單擊網格視圖中彈出的數據后，如何在表單面板中顯示數據，我嘗試了另一種方法，但總是出錯，這是我的網格面板：

var tt = Ext.define('Rendering.view.beli.dataSupplier', {
extend: 'Ext.form.Panel',
//extend: 'Ext.window.Window',
//  xtype: 'beligrid',

alias : 'widget.contatoform',

frame: true,
// id: 'detailPanelis',
title: 'Company data',
bodyPadding: 5,
layout: 'column',
requires: [
    'Ext.grid.*',
    'Ext.form.*',
    'Ext.layout.container.Column'
],

initComponent: function() {
    this.items = [
        {
            columnWidth: 0.65,
            xtype: 'gridpanel',
            reference: 'customerGrid',
            store: 'BeliStore',
            columns : [{
                text: 'Nama',
                dataIndex: 'namaSupplier',
                flex: 1

            }, {
                text: 'Alamat',
                dataIndex: 'address',
                flex: 1

            }],
            listeners: {


                scope: this,
                selectionchange: 'onSelectionChanges'
            }


        }];
    //];
    // });
    this.callParent(arguments);
},

onSelectionChanges: function(model, records) {
        //alert('yuhuuuu');
    var editt = Ext.create('Rendering.view.beli.bg_beli');

    var c =  editt.onSelectionChange(model, records);

}

 });

將數據發送到表單面板的功能是

listeners: {
              scope: this,
                selectionchange: 'onSelectionChanges'
            }

這是onSelectionChanges的功能：

 onSelectionChanges: function(model, records) {
        //alert('yuhuuuu');
    var editt = Ext.create('Rendering.view.beli.bg_beli');

    var c =  editt.onSelectionChange(model, records);

  }

和表單面板：

var tt = Ext.define('Rendering.view.beli.bg_beli', {
extend: 'Ext.form.Panel',

xtype: 'beligrid',

controller: 'binding-dynamic',
frame: true,

title: 'Company data',
bodyPadding: 5,
layout: 'column',



requires: [
    'Ext.grid.*',
    'Ext.form.*',
    'Ext.layout.container.Column'
],

// In this example, configuration is applied at initComponent time
// because it depends on profileInfo object that is generated for the
// FormGrid instance.
initComponent: function() {
    //Ext.apply(this, {


    this.items = [
        {
            columnWidth: 0.65,
            xtype: 'gridpanel',

            store: 'BeliStore',
            columns : [{
                text: 'Nama',
                dataIndex: 'namaSupplier',
                flex: 1

            }, {
                text: 'Alamat',
                dataIndex: 'address',
                flex: 1

            }],
            listeners: {

                scope: this,
                selectionchange: 'onSelectionChange'
            }


        },{
            columnWidth: 0.35,
            margin: '20 0 0 10',
            xtype: 'form',
            title:'Company detailsss',
            layout: 'anchor',

            defaultType: 'textfield',
            items: [
            {

                name : 'id_supplier',
                fieldLabel: 'id',
                hidden:true
            },{
                fieldLabel: 'Nama Supplier',
                name: 'namaSupplier'

            },{
                    fieldLabel: 'email',
                    name: 'email'

            },{
                    fieldLabel: 'alamat',
                    name: 'address'

            },{
                xtype: 'button',
                text: 'YUY',
                action: 'add'
            }]

        }];
    //];
   // });
    this.callParent(arguments);
},

onSelectionChange: function(model, records) {

    alert('asdasd');


    console.log(records);
    var rec = records[0];
    console.log(rec);
    if (rec) {
       var c = this.getForm().loadRecord(rec);
     //   this.getBeliStoreStore().load();
        console.log(this.getForm().loadRecord(rec));
    }
}

});

我將數據從網格發送到表單面板，並且在表單面板中接受數據的功能是：

 onSelectionChange: function(model, records) {

    alert('asdasd');


    console.log(records);
    var rec = records[0];
    console.log(rec);
    if (rec) {
       var c = this.getForm().loadRecord(rec);
     //   this.getBeliStoreStore().load();
        console.log(this.getForm().loadRecord(rec));
    }
}

請幫助，我正在尋找任何參考，但是我還沒有得到答案，謝謝

Answer 1

我的建議是修改事件this.onSelectionChange的調用或類似this.on（'selectionchange'，this.onSelectionChange）的調用，這是extjs中調用事件的另一種方法

initComponent: function() {

    var me = this ;

    this.items = [
        {
            columnWidth: 0.65,
            xtype: 'gridpanel',
            reference: 'customerGrid',
            store: 'BeliStore',
            columns : [{
                text: 'Nama',
                dataIndex: 'namaSupplier',
                flex: 1

            }, {
                text: 'Alamat',
                dataIndex: 'address',
                flex: 1

            }],
            listeners: {    
                scope: this,
                selectionchange: me.onSelectionChanges
            }


        }];
    //];
    // });
    this.callParent(arguments);
}

OR

initComponent: function() {
    var me = this ;

    var grid = Ext.create('Ext.grid.Panel', {
                     reference: 'customerGrid',
                     store: 'BeliStore',
                     columns : [{
                         text: 'Nama',
                         dataIndex: 'namaSupplier',
                         flex: 1

                      }, {
                         text: 'Alamat',
                         dataIndex: 'address',
                         flex: 1   
                     }
                    ]});

    me.items = [
        {
            columnWidth: 0.65,
            grid               

        }];       

    grid.on('selectionchange',me.onSelectionChange)

    this.callParent(arguments);
}

http://docs.sencha.com/extjs/4.2.5/#!/example/build/KitchenSink/ext-theme-neptune/#form-grid