表单的 ExtJs getRecord() 函数不起作用

Question

我想通过 getRecord() 函数从我的表单中获取我的值。这是我目前从 form.getRecord():

得到的结果

数据对象为空。

这是我的控制器：

onAddNewsClick: function(button, e, eOpts) {

    var win = this.getNewsEdit();
    if(!win){
        win = Ext.create('widget.newsedit');
    }
    this.getNewsPanel().loadRecord(Ext.create('model.news'));
    console.log(this.getNewsPanel());
    this.adding = true;
    win.show();
},

OnSaveNewsClick: function(button, e, eOpts) {

    var form = this.getNewsPanel();
    console.log(form);
    var selectedRecord = form.getRecord();
    console.log(selectedRecord);
    if (this.adding) {
        this.adding = undefined;
    }
}

对应型号：

Ext.define('mobile_admin.model.News', {
extend: 'Ext.data.Model',
alias: 'model.news',

requires: [
    'Ext.data.field.Field'
],

fields: [
    {
        name: 'title'
    },
    {
        name: 'newscontent'
    },
    {
        name: 'newsdate'
    },
    {
        name: 'status'
    }
]});

使用 form.getValues() 我得到了表单的所有值。

感觉模型没有连接到表单。在表格中我输入了必要的名称连接：([=14=])

我的表格项目：

    items: [
    {
        xtype: 'textfield',
        fieldLabel: 'Titel',
        name: 'title'
    },
    {
        xtype: 'datefield',
        fieldLabel: 'Datum',
        name: 'newsdate'
    },
    {
        xtype: 'htmleditor',
        height: 150,
        width: 600,
        fieldLabel: 'Inhalt',
        name: 'newscontent',
    },
    {
        xtype: 'textfield',
        fieldLabel: 'Status',
        name: 'status'
    },
]

有人有想法吗？我使用 ExtJs (5.1.3).

//编辑：我发现我可以这样设置记录：

var b = form.getRecord()
b.set(form.getValues()

这个 ExtJs 不应该自动执行吗？

Answer 1

loadRecord 真正做的只是设置值。表单不再使用此记录。这是表格文档：

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

您询问是否可以自动完成要记录的设置值。是的，可以，但需要绑定。

我准备了示例代码：

Ext.define('mobile_admin.model.News', {
    extend: 'Ext.data.Model',
    alias: 'model.news',

    requires: [
        'Ext.data.field.Field'
    ],

    fields: [
        {
            name: 'title', defaultValue : 'test'
        },
        {
            name: 'newscontent'
        },
        {
            name: 'newsdate'
        },
        {
            name: 'status'
        }
    ]
});

Ext.define('mobile_admin.form.ViewModel', {
    extend: 'Ext.app.ViewModel',
    alias: 'viewmodel.formpanel',

    links : {
        theModel : {
            type : 'mobile_admin.model.News',
            create : true
        }
    }
});

Ext.define('mobile_admin.form.formpanel', {
    extend: 'Ext.form.Panel',
    alias: 'widget.newsedit',
    viewModel : 'formpanel',

    items : [
        {
            xtype: 'textfield',
            fieldLabel: 'Titel',
            name: 'title',
            bind : {
                value : '{theModel.title}'
            }
        },
        {
            xtype: 'datefield',
            fieldLabel: 'Datum',
            name: 'newsdate',
            bind : {
                value : '{theModel.newsdate}'
            }
        },
        {
            xtype: 'htmleditor',
            height: 150,
            width: 600,
            fieldLabel: 'Inhalt',
            name: 'newscontent',
            bind : {
                value : '{theModel.newscontent}'
            }
        },
        {
            xtype: 'textfield',
            fieldLabel: 'Status',
            name: 'status',
            bind : {
                value : '{theModel.status}'
            }
        }],

    buttons : [{
        text : 'Save',
        handler : function(button) {
            var vM = button.up('form').getViewModel();
            vM.notify();
            console.log(vM.get('theModel').getData());
        }
    }]
});

Ext.application({
    name : 'Fiddle',

    launch : function() {
        debugger;
        var form = Ext.widget('newsedit');
        var window = Ext.widget('window', {
            items : form
        });
        window.show();
    }
});

表单的 ExtJs getRecord() 函数不起作用

ExtJs getRecord() function of form does not work

forms

extjs

extjs5