Question

我有一个listContainer并且点击列表中的任何项目，我打开另一个名为editContainer的页面，其中包含列表中的记录。在编辑页面中，我想根据另一个字段的值禁用下拉列表，有没有什么方法可以在editContainer的initialize函数中获取记录中的值？这是我的代码： -

onListItemTap:function(dataview,index,target,record,e,eOpts)
{
if(record)
this.editContainer = Ext.create('myApp.view.EditContainer',{title:'Edit Data'});
this.editContainer.setRecord(record);
this.getMainNav().push(this.editContainer);
}

上面的代码在选择列表项时打开editContainer。下面是我的EditContainer

Ext.define('myApp.view.EditContainer', {
    extend: 'Ext.Container',

    requires: [
    'Ext.form.Panel',
    'Ext.form.FieldSet',
    'Ext.field.Select'
],

config: {
    id: 'editContainer',
    autoDestroy: false,
    layout: 'fit',
    items: [
        {
            xtype: 'formpanel',
            id: 'editFormPanel',
            padding: 10,
            styleHtmlContent: true,
            autoDestroy: false,
            layout: 'fit',
            items: [
                {
                    xtype: 'fieldset',
                    id: 'nameFieldSet',
                    autoDestroy: false,
                    items: [
                        {
                            xtype: 'textfield',
                            id: 'siteName',
                            itemId: 'mytextfield',
                            label: 'Name',
                            labelWidth: '35%',
                            name: 'name'
                        },
                        {
                            xtype: 'selectfield',
                            id: 'role',
                            itemId: 'myselectfield4',
                            label: 'Role',
                            labelWidth: '35%',
                            name: 'role',
                            options: [
                                {
                                    text: 'Unassigned',
                                    value: 'Unassigned'
                                },
                                {
                                    text: 'Role1',
                                    value: 'role1'
                                }
                            ]
                        },
                        {
                            xtype: 'selectfield',
                            id: 'type',
                            label: 'Type',
                            labelWidth: '35%',
                            name: 'type',
                            options: [
                                {
                                    text: 'Default',
                                    value: 'Default'
                                },
                                {
                                    text: 'Custom',
                                    value: 'custom'
                                }
                            ]
                        },
                        {
                            xtype: 'selectfield',
                            id: 'roleValue',
                            label: 'Role Value',
                            labelWidth: '35%',
                            name: 'rolevalue',
                            options: [
                                {
                                    text: 'value1',
                                    value: 'value1'
                                },
                                {
                                    text: 'value2',
                                    value: 'value2'
                                },
                                {
                                    text: 'value3',
                                    value: 'value3'
                                }
                            ]
                        }
                    ]
                }
            ]
        }
    ],
    listeners: [
        {
            fn: 'onTextfieldKeyup',
            event: 'keyup',
            delegate: 'textfield'
        },
        {
            fn: 'onSelectfieldChange',
            event: 'change',
            delegate: 'selectfield'
        }
    ]
},

onTextfieldKeyup: function(textfield, e, eOpts) {
    this.fireEvent('change', this);
},

onSelectfieldChange: function(selectfield, newValue, oldValue, eOpts) {
    this.fireEvent('change', this);
},

initialize: function() {
    this.callParent();
    var record;

    //Code to disable roleValue selectfield if Role is unassigned.
},

updateRecord: function(newRecord) {
    var me = this,
        myPanel = me.down('#editFormPanel');

    if(myPanel)
        myPanel.setRecord(newRecord);

},

saveRecord: function() {
    var me =this,
        myStore = Ext.data.StoreManager.lookup('MyStore');

    var formPanel = me.down('#editFormPanel'),
        record = formPanel.getRecord();
    formPanel.updateRecord(record);

    return record;
}

});

Answer 1

由于创建editContainer并设置其数据是代码中的两个不同步骤，因此无法使用editContainer的initialize方法。

但是你可以覆盖editContainer的setRecord方法，因此它还会禁用下拉列表。

由于您将editContainer推送到导航视图，您还可以使用editContainer的activate事件来禁用下拉列表。

Answer 2

也许您可以动态创建快速商店，作为引用该数据的地方......

    //in your controller where you set the record

    var mod = Ext.define('app.model.PanelDataModel', {
        extend: 'Ext.data.Model',
        config: {
            fields: [
                'roleValue'
            ]
        }
    });

    var sto = Ext.create('Ext.data.Store', {
        model: mod,
        id:'PanelDataStore'
    });

    sto.add({
        roleValue: record.roleValue
    });
    sto.sync();


    //Now in your panel's initialize method:

    var pstore = Ext.getStore('PanelDataStore');
    pstore.load();

    if(pstore.data.all[0].data.roleValue == 'unassigned'){
        Ext.getCmp('roleValue').setDisabled(true);
    }

获取容器的记录＆＃34;初始化＆＃34;在Sencha Touch

2 个答案: