如何通过更改一个列号字段来更新另一个列号字段

Question

我有一个网格，其中有两个 widgetColumn 数字字段。我想如果我更改数字字段一 (Test1)，那么数字字段 (Test2) 的值应该自动填充。

这是我的代码。我尝试了很多听众但没有用。

Ext.onReady(function() {

var count = "a";

Ext.create('Ext.data.Store', {
    storeId: 'simpsonsStore',
    fields: ['name', 'email', 'phone'],
    data: {
        'items': [{
            'name': 'Lisa',
            "email": "lisa@simpsons.com",
            "phone": "555-111-1224"
        }, {
            'name': 'Bart',
            "email": "bart@simpsons.com",
            "phone": "555-222-1234"
        }, {
            'name': 'Homer',
            "email": "home@simpsons.com",
            "phone": "555-222-1244"
        }, {
            'name': 'Marge',
            "email": "marge@simpsons.com",
            "phone": "555-222-1254"
        }]
    },
    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            root: 'items'
        }
    }
});

Ext.create('Ext.grid.Panel', {
            title: 'Simpsons',
            selType: 'rowmodel',
            plugins: [
                Ext.create('Ext.grid.plugin.RowEditing', {
                    clicksToEdit: 1,
                    autoCancel: false

                })
            ],

            store: Ext.data.StoreManager.lookup('simpsonsStore'),

            columns: [{
                    text: 'Name',
                    dataIndex: 'name',
                    editor: {
                        xtype: 'textarea',
                        allowBlank: false,
                        listeners: {

                            change: function (field, newValue, o, e) {
                                debugger;
                                var text = field.value;
                                var record = e.record;
                                var selectedModel = this.up('grid').getSelectionModel().getSelection()[0];
                                selectedModel.set('Name', text);
                                selectedModel.set('email', text);
                            }
                        },
                    }
                }, {
                    text: 'Email',
                    dataIndex: 'email',
                    flex: 1
                }, {
                    text: 'Phone',
                    dataIndex: 'phone'
                }, {
                    "xtype": "widgetcolumn",
                    "header": "Test1",
                    "dataIndex": "Test1",
                    "itemId": "landedGrossQty",
                    "flex": 1,
                    "widget": {
                        "xtype": "numberfield",
                        "minValue": 0,
                        "listeners": {
                            "change": function (field, newValue, o, e) {
                                debugger;

                            }
                        }
                    }
                    },
                    {
                        "xtype": "widgetcolumn",
                        "header": "Test2",
                        "dataIndex": "Test2",
                        "flex": 1,
                        "widget": {
                            "xtype": "numberfield",
                            "minValue": 0,
                        }
                    }],

                height: 200,
                width: 400,
                renderTo: Ext.getBody()
            });


});

Answer 1

一种解决方案是编辑所需的记录字段（在您的情况下 "Test2"），如下所示：

{
    xtype: "widgetcolumn",
    header: "Value",
    dataIndex: "Test1",
    itemId: "landedGrossQty",
    flex: 1,
    widget: {
        xtype: "numberfield",
        minValue: 0,
        listeners: {
            change: function(field, newValue, o, e) {
                let record = field.getWidgetRecord(); //getting the store record
                record.data.Test1 = newValue; //setting the value of this field to its new value
                record.data.Test2 = newValue * 2 //setting the value of Test2 field to Test1*2;
                record.commit(); //commiting the changes to the store
            }
        }
    }
}

Fiddle

如何通过更改一个列号字段来更新另一个列号字段

How to update another column numberfield by changing one column number field

javascript

extjs

extjs6