Javascript 如何将处理函数的一部分放入Sencha中的控制器

我有一个处理函数，它创建了一个

Ext.window.window

，带有输入数据的字段，我需要将这部分代码移动到一个控制器函数，并将其与主ajax请求分离，这是为了代码重用

var win = Ext.create('Ext.window.Window', {
    title: 'New Client',
    id: 'addClientWindow',
    width: 500,
    height: 300,
    items: [{
        xtype: 'form',
        bodyPadding: 10,
        items: [{
            xtype: 'fieldset',
            title: 'My Fields',
            items: [{
                xtype: 'textfield',
                anchor: '100%',
                id: 'nameTextField',
                fieldLabel: 'Name',

                labelWidth: 140
            }, {
                xtype: 'textfield',
                anchor: '100%',
                id: 'physicalTextField',
                fieldLabel: 'Physical Address',

                labelWidth: 140
            }, {
                xtype: 'textfield',
                anchor: '100%',
                id: 'postalTextField',
                fieldLabel: 'Postal Address',

                labelWidth: 140
            }]
        }],
        dockedItems: [{
            xtype: 'toolbar',
            dock: 'bottom',
            items: [{
                xtype: 'button',
                id: 'cancelClientBtn',
                text: 'Cancel',
                listeners: {
                    click: function(c) {
                        Ext.getCmp('addClientWindow').close();
                    }

                }
            }, {
                xtype: 'tbspacer',
                flex: 1
            }, {
                xtype: 'button',
                id: 'saveClientBtn',
                text: 'Save',
                listeners: {
                    click: function(c) {

                        Ext.Ajax.request({
                            url: 'system/index.php',
                            method: 'POST',
                            params: {
                                class: 'Company',
                                method: 'add',
                                data: Ext.encode({
                                    name: Ext.getCmp('nameTextField').getValue(),
                                    physical: Ext.getCmp('physicalTextField').getValue(),
                                    postal: Ext.getCmp('postalTextField').getValue()

                                })
                            },
                            success: function(response) {
                                Ext.MessageBox.alert('Status', 'Record has been updated.');
                                Ext.getStore('CompanyStore').reload();
                                Ext.getCmp('addClientWindow').close();
                            },
                            failure: function() {
                                Ext.MessageBox.alert('Status', 'Failed to update record.');
                            }
                        });

                    }
                }
            }]
        }]
    }]
});

win.show();

---

按钮打开这个窗口并执行这个ajax请求，我只需要将两者分开。非常感谢您的帮助。

您可以在一个单独的文件中定义窗口并为其指定别名：

Ext.define('MyApp.view.MyWindow', {
    extend: 'Ext.window.Window',
    alias: 'widget.addclient',
    ...

    click: function(){
        var data = Ext.encode({
            name: Ext.getCmp('nameTextField').getValue(),
            physical: Ext.getCmp('physicalTextField').getValue(),
            postal: Ext.getCmp('postalTextField').getValue()
         });

         // I assume here "this" links to the window component,
         // if not, adjust accordingly
         if(this.mycallback){
            this.mycallback(data);
         }
    }

});

然后，您可以从其他控制器调用它并提供回调：

Ext.define('MyApp.view.MyController', {
    extend: 'Ext.app.ViewController',

    requires: 'MyApp.view.MyWindow',

    openWindow: function(){
        var win = Ext.widget('addclient');
        win.mycallback = this.onAddClientCallback.bind(this);
        win.show();
    },

    onAddClientCallback: function(data){
        console.log("data from window", data);
    }

});

---

你使用的是哪个版本的ExtJS？关键是我在多个选项卡上添加了记录按钮，所以基本上我需要相同的窗口来访问所有不同的调用，因为现在我上面的代码在每个处理程序中，我只需要在一个地方访问它，这不可避免地会重复id，这是我想要避免的我想看看你在说什么，如果我有多个ajax请求和多个不同的视图，因为不是所有的视图都是相同的，所以一个可以有3个字段，另一个可以有4个其他不同的视图。我的项目结构有点复杂，现在每个处理程序中都有窗口创建代码以及特定的ajax请求。如果这些窗口具有比重复代码更独特的代码，那么您可以创建父窗口视图和/或视图控制器，并将一些要重用的常见代码移到那里，然后对其进行扩展。如果除了它们都是窗口之外没有什么共同点，那么创建一个新的唯一窗口是可以的，我会将窗口代码放入一个单独的文件中，并从控制器中分离视图（您当前正在视图中处理侦听器，通常它们应该被分离为所谓的视图控制器）。