form.getRecord（）未定义。 Extjs

Question

在我的应用程序中，我使用Ext.form.Panel组件。在面板中，使用loadRecord(record)

设置从树中选择的条目

...
showDataFields: function(view, record, item, index, event) {       
        var panel = view.up('tabpanel');
        var formfield   = panel.down('form');        
        formfield.loadRecord(record);
    },

....

我得到一个条目以将数据发送到商店

...

saveUserData: function(button, e) {
        var values;
        var panel    = button.up('actionform'),
            form   = panel.down('form');
        record = form.getRecord();
        console.log(record)// value undefined. Why ?      
    },

...

如何获取记录？

链接到我的fiddle应用程序，该表单位于文件app / view / ActionFormTree.js

showDataFields和saveUserData方法位于app / controller / MainController.js中

谢谢

Answer 1

如果我正确理解了您的设计，我认为问题出在您如何引用表单。

saveUserData: function(button, e) {

    var values;
    var panel  = button.up('tabpanel'),
        form   = panel.down('form');
    // Or, because button is on your form:
    // var form = button.up('form');

    record = form.getRecord();
    console.log(record)// value undefined. Why ?

    //store = this.getUserTreeStoreStore('UserTreeStore');
    //values = form.getValues();
    //id = form.getRecord().get('id');

},

Answer 2

使用form获取button.up('actionform')组件时，然后又使用panel.down('form')。因此，在这种情况下，您将获得form组件的内部form。请参见下面的屏幕截图，以更好地理解（请参阅选定的dom元素）

因此您不需要使用下选择器，因为您已经使用form获得了button.up('actionform')组件。

代码段

saveUserData: function(button, e) {

    var values, form = button.up('actionform'),
        record = form.getRecord();

    console.log(record)
},

您可以在这里使用fiddle进行检查。

Answer 3

更好的方法是将itemId属性分配给表单面板并使用getValues（）函数

var formpanel = Ext.ComponentQuery.query('form[itemId=your_form_itemId_here]')[0];
var form = formpanel.getForm();//this gets all the fields inside the form 
//no to fetch the record or form field values
var record = form.getValues();

这是方便的功能，用于获取表单中每个字段的当前值。 ...