使用fieldcontainer中的config设置textfield的值

时间:2012-08-02 12:05:08

标签: extjs extjs4 extjs4.1

我无法设置fieldcontainer中文本字段的值。我想为“fieldcontainer”中的“textfield”设置值和其他配置。所以基本上我设置了从服务器收到的文本字段的配置,例如:allowBank:true,maxlength:4,value:'Hello World'我从服务器获取并希望将其提供给内部的textdfield我的自定义控件是fieldcontainer。除了使用内置textConfig的值配置外,将应用所有其他配置。以下是我的代码:

Ext.define('PTextField', { extend: 'Ext.form.FieldContainer',
            alias: 'widget.ptextfield',
            requires: ['Ext.form.TextField', 'Ext.Img'],
            width: 170,
            fieldLabel: 'Empty Label',
            labelAlign: 'top',
            layout: {
                type: 'hbox'
            },
            BLANK_IMAGE_URL: '',


            constructor: function (config) {
                this.callParent(arguments);


                Ext.apply(this.down('textfield'), this.textConfig);
                Ext.apply(this.down('image'), this.imgConfig);


            }, // eo function constructor




            initComponent: function () {
                var me = this;
                this.textBox = this.createTextField();
                this.imageBox = this.createImagefield();
                this.items = [this.imageBox, this.textBox];
                this.callParent(arguments);
            }, //eo initComponent
            createTextField: function () { return {xtype: 'textfield'} },
            createImagefield: function () { return { xtype: 'image', height: 20, width: 20} }
        });

var fname = Ext.create('PTextField', {
            fieldLabel: 'First Name',
            textConfig: { value: 'Hello World', allowBlank: false, readOnly: true,     maxLength: 4, width: 100 },
            imgConfig: { src: 'http://www.sencha.com/img/20110215-feat-html5.png' }
        });

fname.render(Ext.getBody());

我正在使用extjs 4.1。 任何帮助表示赞赏。

2 个答案:

答案 0 :(得分:1)

我会将你的代码简化为类似的东西:

删除整个构造函数()函数。你不需要它。

将字段集的initComponent()函数重写为:

initComponent: function() {
   var me = this;

   Ext.apply(me, items: [{
      xtype: 'textfield',
      value: me.textConfig.value,
      .... 
   }, {
      xtype: 'image',
      src: me.imageConfig.src,
      ... 
   }]);
}

答案 1 :(得分:1)

您应该使用配置创建文本字段和图像。然后使用创建的对象定义items数组,如下所示:

initComponent: function() { 
    var me = this,
        textfield = Ext.widget('textfield', me.textConfig),
        image = Ext.widget('image', me.imgConfig);

    me.items = [textfield, image];
    me.callParent(arguments); 
},