Ext JS AddRecord方法：向Store加记录并在Grid显示问题咨询

我看了你的代码，里面有几个关键错误导致无法正常添加记录到Grid，下面我会一步步帮你修正：

代码中的核心问题 #

• Store获取方式错误：你用grid.getStore('store.Personal')的写法不对，getStore()方法不传参数就能获取当前Grid绑定的Store；若要通过storeId获取，应该用Ext.getStore('store.Personal')
• 表单组件与数据获取混淆：var form = this.up('form').grid.getStore();这行完全搞错了，你需要的是获取表单组件本身，而不是它关联的Store
• 添加记录的逻辑错误：调用form.add()是错误的，表单没有add方法，正确逻辑是先获取表单输入值，再将数据添加到Store中
• 冗余无用代码：var record = Ext.getStore().getAt(rowId);这行里Ext.getStore()未指定storeId，且变量后续未使用，可以直接删除

修正后的完整AddRecord方法 #

AddRecord: function (grid) {
    Ext.create('Ext.window.Window', {
        title: "Add Person",
        height: 200,
        width: 400,
        closeAction: 'hide',
        closable: true,
        items: [{
            xtype:'form',
            defaultType: 'textfield',
            layout: 'anchor',
            items: [{
                fieldLabel: 'First Name',
                name: 'firstName', // 建议用驼峰命名，和模型字段保持一致
                allowBlank: false
            }, {
                fieldLabel: 'Last Name',
                name: 'lastName', // 统一驼峰命名规范
                allowBlank: false
            }],
            buttons: [{
                text: 'Add',
                formBind: true,
                disabled: true,
                handler: function () {
                    // 获取当前表单组件
                    var form = this.up('form');
                    // 获取Grid绑定的Store
                    var store = grid.getStore();
                    
                    if (form.isValid()) {
                        // 获取表单输入的所有字段值
                        var formValues = form.getValues();
                        // 向Store添加新记录，Grid会自动刷新显示
                        store.add(formValues);
                        // 添加完成后关闭窗口
                        this.up('window').close();
                    }
                }
            }, {
                text: 'Close',
                handler: function () {
                    this.up('window').close();
                }
            }]
        }]
    }).show();
}

关键改动说明 #

1. 简化Store获取：直接用grid.getStore()拿到Grid绑定的Store，避免storeId拼写错误的问题
2. 正确获取表单组件：用this.up('form')定位到当前按钮所在的表单组件，调用getValues()获取用户输入的所有字段值
3. 修正添加记录逻辑：通过store.add(formValues)直接把表单数据作为新记录添加到Store，Grid会自动渲染这条新记录
4. 字段命名规范：把表单字段的name改成驼峰命名（比如firstName），符合ExtJS模型字段的命名习惯，避免空格带来的潜在问题
5. 移除冗余代码：删掉了未使用的record变量定义，让代码更简洁清晰

这样修改后，点击Add按钮就能把表单内容添加到Grid对应的Store中，Grid会自动刷新显示新记录啦。

内容的提问来源于stack exchange，提问作者MrNoOne007