Question

我有一个要求，我必须在表单中多次显示模型中的特定值。但是当我尝试它时，表单只会被映射的第一个引用而不是其他引用加载。

型号代码

        Ext.define('USOC',{
            extend: 'Ext.data.Model',
            fields: [
                {name: 'USOCCode', mapping: 'Detail > USOCCode'},
                'USOCCode',
                'TariffReference',
                'Telephone',
                'EffectiveDate',

表格代码

items: [{
                                                        columnWidth: 0.4,
                                                        margin: '3 0 0 10',
                                                        xtype: 'container',
                                                        layout:'anchor',
                                                        height: 280,
                                                        defaults: {
                                                            labelWidth: 150
                                                        },
                                                        defaultType: 'textfield',
                                                        items: [{
                                                        xtype: 'container',
                                                        layout: 'hbox'
                                                        },
                                                        {
                                                            xtype: 'fieldset',
                                                            title: 'Recurring Charge Footnote Key',
                                                            columnWidth:1.5,
                                                            layout: 'column',
                                                            defaultType: 'textfield',
                                                            width:1285,
                                                            //height:200,
                                                            defaults: {
                                                            labelWidth: 120,
                                                            margin: '3 0 0 40',
                                                            fieldStyle:"border:none 0px black",
                                                            readOnly: true
                                                            },
                                                            items: [{
                                                                fieldLabel: 'Universal Service Ordering Code',
                                                                name: 'USOCCode',
                                                                    width: 350,
                                                                    labelWidth: 180
                                                            },{
                                                                fieldLabel: 'Footnote Key',
                                                                name: 'FootnoteKey',
                                                                    width: 250
                                                            },{
                                                                fieldLabel: 'Description',
                                                                name: 'Description1',
                                                                    width: 500
                                                            }]
                                                        },
                                                        {
                                                            xtype: 'fieldset',
                                                            title: 'Non - Recurring Charge Footnote Key',
                                                            columnWidth:1.5,
                                                            layout: 'column',
                                                            defaultType: 'textfield',
                                                            width:1285,
                                                            //height:200,
                                                            defaults: {
                                                            labelWidth: 120,
                                                            margin: '3 0 0 40',
                                                            fieldStyle:"border:none 0px black",
                                                            readOnly: true
                                                            },
                                                            items: [{
                                                                fieldLabel: 'Universal Service Ordering Code',
                                                                name: 'USOCCode',
                                                                    width: 350,
                                                                    labelWidth: 180
                                                            },{
                                                                fieldLabel: 'Footnote Key',
                                                                name: 'FootnoteKey1',
                                                                    width: 250
                                                            },{
                                                                fieldLabel: 'Description',
                                                                name: 'Description2',
                                                                    width: 500
                                                            }]

在上面的代码中，我试图为fieldSet'Recurring Charge Footnote Key'和'Non-Reringring Charge Footnote Key'显示USOCCode。但该值仅显示在第一个引用中，而不显示在第二个引用中。我在API上读到该名称必须是唯一的，但是如果我必须显示两次，那么是否有相同的解决方法？

提前致谢

Answer 1

嗯，我想你需要一个自定义字段来委托设置，如

Ext.define('Ext.ux.form.field.Delegate',{
    extend: 'Ext.form.field.Hidden',
    alias: 'widget.delegatefield'

    width: 0,
    height: 0,
    setValue: function(val) {
        va me = this;
        me.setBoundFields(val);
        me.callParent();
    }
});

其中有一个回调方法作为param，在字段设置时调用。下面我已将其集成到您的代码中

items: [
    {
        columnWidth: 0.4,
        margin: '3 0 0 10',
        xtype: 'container',
        layout:'anchor',
        height: 280,
        defaults: {
            labelWidth: 150
        },
        defaultType: 'textfield',
        items: [
            {
                xtype: 'container',
                layout: 'hbox'
            },
            {
                xtype: 'delegatefield',
                name: 'USOCCode',
                setBoundFields: function(val) {
                    var fields = Ext.ComponentQuery.query('[ident=USOCCode]'),
                        len = fields.length,
                        i = 0;
                    for(;i<len;i++) {
                        fields.setValue(val);
                    }
                }
            },
            {
                xtype: 'fieldset',
                title: 'Recurring Charge Footnote Key',
                columnWidth:1.5,
                layout: 'column',
                defaultType: 'textfield',
                width:1285,
                //height:200,
                defaults: {
                labelWidth: 120,
                margin: '3 0 0 40',
                fieldStyle:"border:none 0px black",
                readOnly: true
                },
                items: [
                    {
                        fieldLabel: 'Universal Service Ordering Code',
                        ident: 'USOCCode',
                        width: 350,
                        labelWidth: 180
                    },
                    {
                        fieldLabel: 'Footnote Key',
                        name: 'FootnoteKey',
                        width: 250
                    },
                    {
                        fieldLabel: 'Description',
                        name: 'Description1',
                        width: 500
                    }
                ]
            },
            {
                xtype: 'fieldset',
                title: 'Non - Recurring Charge Footnote Key',
                columnWidth:1.5,
                layout: 'column',
                defaultType: 'textfield',
                width:1285,
                //height:200,
                defaults: {
                    labelWidth: 120,
                    margin: '3 0 0 40',
                    fieldStyle:"border:none 0px black",
                    readOnly: true
                },
                items: [
                    {
                        fieldLabel: 'Universal Service Ordering Code',
                        ident: 'USOCCode',
                        width: 350,
                        labelWidth: 180
                    },{
                        fieldLabel: 'Footnote Key',
                        name: 'FootnoteKey1',
                        width: 250
                    },{
                        fieldLabel: 'Description',
                        name: 'Description2',
                        width: 500
                    }
                ]
            }
        ]
    }

使用extjs在表单中多次显示文本字段

1 个答案: