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

如何从网格（弹出）发送值到extjs

1 个答案: