Extjs 4：在不使用 MVC 框架的情况下将存储数据渲染到 Ext.form.Panel

Question

您将在下面找到一个包含两个字段的 Ext.form.Panel。我在模型中选择了两个包含数据的随机字段。他们没有在表单中呈现。请注意，在这段代码中，我没有在 Extjs 框架中使用 MVC。 如何让这些字段呈现？我已经粘贴了 store.data.toSource() 的相关输出，以表明我的商店中确实有数据，并且只有一条记录.要以稍大的分辨率查看图像，请右键单击它并在另一个选项卡中查看。

注意：.toSource() 仅适用于 Mozilla Firefox

我在创建表单后尝试执行此操作，但没有成功：

taskForm.getForm().loadRecord(store.getAt(0));

代码：

    var taskForm = Ext.create('Ext.form.Panel', {
        title: 'Task',
        id: 'form1',
        width: 600,
        height: 200,
        bodyPadding: 10,
        renderTo: 'TaskEditForm',
        store: store,
        style: {
            'position': 'fixed',
            'top': '100px',
            'left': '10px'
        },

        items: [{
            xtype: 'label',
            labelAlign: 'right',
            name: 'project_id',
            fieldLabel: 'Project ID',
            width: 100
        }, {
            xtype: 'label',
            labelAlign: 'right',
            name: 'user_responsible',
            fieldLabel: 'User',
            width: 100
        }],

        buttons: [{
            text: 'Save Task Detail',
            handler: function (btn) {

                alert(store.data.toSource());

            }

        }]
    });

========

编辑：@Evan

此代码给出以下错误：

taskForm.getForm().loadRecord(store.getAt(0));

错误：

TypeError: record is undefined

...

return this.setValues(record.data);  // ext-all-debug.js (line 109529)

第 109529 行：

loadRecord: function(record) {
  this._record = record;
  return this.setValues(record.data);
}, 

Answer 1

您阅读过文档吗？ store.data 是一个 MixedCollection，它拥有一堆记录。 load 方法的文档说：

处理从服务器加载数据到字段的类 一个 Ext.form.Basic。

您不能只输入随机参数并期望某些东西起作用。

你可能想要的是：

form.getForm().loadRecord(store.getAt(0)); // Load the first store record into the form