Sencha Touch,setRecord()不起作用。字段是空白的。

时间:2015-04-08 00:51:17

标签: sencha-touch

我是Sencha Touch的新手......

我一直在搜索并询问人们几个小时,但无法弄清楚为什么我的详细信息视图无法获取数据(使用setRecord)。

我无法找到一个使用Ext.NavigationView推送使用setRecord数据的视图的示例,所以我怀疑我在那里做错了。

我有一个标签视图。第一个选项卡显示项目列表。单击项目披露以查看该项目的详细信息。出现详细视图,但没有任何数据。

  • 选项卡在ViewPortController的启动功能中设置。
  • 第一个标签中的主视图是PeopleListView。所有人都出现在列表中。
  • 将PeopleListView添加到Ext.NavigationView。 Ext.NavigationView的引用被添加到PeopleListView,以便稍后使用
  • PeopleListViewController有一个函数showDetailView,当点击一个公开按钮时成功调用它。
  • 控制器的showDetailView功能
    • 在personDetailView上设置记录(包含正确的数据),
    • 检索Ext.NavigationView的实例并推送PersonDetailView。
  • 传递给showDetailView的记录值具有正确的数据。
  • 当personDetailView出现时,这些字段没有数据。

ViewPortController:

launch: function() {
    // var personDetailView = {
    //    xtype: 'persondetailview'
    // }
    var pplView = Ext.create('PeopleApp.view.PeopleListView');
    var pplNavView = Ext.create('Ext.NavigationView', {
        title: 'People',
        iconCls: 'home',
        useTitleForBackButtonText: true,
    });
    pplView.setNavigationView(pplNavView);
    pplNavView.add(pplView);
    . . .
    var mainViewPort = getMainViewPort();
    mainViewPort.setItems([pplNavView, . . .]);
}, 

PersonModel:

Ext.define('PeopleApp.model.PersonModel', {
extend: 'Ext.data.Model',
requires: ['Ext.data.proxy.Rest'],
config: {
    idProperty: 'id',
    fields: [
        { name: 'id',       type: 'auto'   },
        { name: 'name',     type: 'string' },
        { name: 'address',  type: 'string' },
        { name: 'email',    type: 'string' },
        { name: 'age',      type: 'int'    },
        { name: 'gender',   type: 'string' },
        { name: 'note',     type: 'string' }
    ],
    proxy: {
        type: 'rest',
        url: '/app/data/people.json',
        reader: {
            type: 'json',
            rootProperty: 'people'
        }
    },
}
});

PeopleListViewController:

Ext.define('PeopleApp.controller.PeopleListViewController', {
extend: 'Ext.app.Controller',
xtype: 'peoplelistviewcontroller',
config: {
    refs: {
        peopleListView: 'peoplelistview',
        personDetailView: 'persondetailview',
        peopleView: 'peopleview',
    },
    control: {
        peopleListView: {
            discloseDetail: 'showDetailView'
        }
    }
},

showDetailView: function(view, record) {
    console.log("record.data.name=" + record.data.name);

    var detailView = Ext.create('PeopleApp.view.PersonDetailView');
    //var detailView = this.getPersonDetailView();
    detailView.setRecord(record);
    var navView = view.getNavigationView();
    navView.push(detailView);
},

launch: function() { this.callParent(arguments); },
init: function() { this.callParent(arguments); },
});

PersonDetailView:

Ext.define('PeopleApp.view.PersonDetailView', {
extend: 'PeopleApp.view.BaseView',
xtype: 'persondetailview',
requires: [
    'Ext.form.FieldSet',
    'Ext.form.Text',
    'Ext.form.TextArea'
],
config: {
    title: "Person Details",
    scrollable: true,
    items: [{
        xtype: 'fieldset',
        items: [{
                xtype: 'textfield',
                name: 'name',
                label: 'Name: ',
                required: true
            }, {
                xtype: 'textfield',
                name: 'age',
                label: 'Age: ',
                required: false
            }, // etc.
        ]}
    ]}
});

你能告诉我为什么detailView.setRecord(record)没有得到DetailViewController字段中的数据集,以及我需要采取哪些不同的做法?

1 个答案:

答案 0 :(得分:0)

我不确定,但您应该在Person详细信息视图中使用以下代码:

items: [
    {
        xtype:'formpanel',
        id:'personDetailViewForm',
        items:[{
                 xtype: 'fieldset',
                 items: [{
                    xtype: 'textfield',
                    name: 'name',
                    label: 'Name: ',
                    required: true
                  }, {
                    xtype: 'textfield',
                    name: 'age',
                    label: 'Age: ',
                    required: false
                  }, // etc.
                ]
             }]
       }]

并且在personListViewController中,您可以设置该表单的值,而不是将记录设置为视图,如:

   var detailView = Ext.create('PeopleApp.view.PersonDetailView');
   var personDetailViewForm = detailView.down('#personDetailViewForm ');
   personDetailViewForm .setValues(records);

请注意,记录对象属性名称和表单字段名称必须匹配,如果records不起作用,请尝试使用records.data