4

我有一个表格。还有很多textfields。我使用allowBlank属性不允许用户将字段留空并blankText定义自定义“空白错误”文本。

{
 xtype: 'textfield',
 fieldLabel: 'Surname',
 name: 'person_surname',
 allowBlank: false,
 blankText: 'Please fill "Surname" field',                  
},

我的问题是:

有没有办法在同一个对象的另一个属性中使用 Ext.form.field.Text 的对象属性?

就像是:

{
 xtype: 'textfield',
 fieldLabel: 'Surname',
 name: 'person_surname',
 allowBlank: false,
 blankText: 'Please fill "' + fieldLabel + '" field',                  
},

(不起作用)

或者:

{
 xtype: 'textfield',
 fieldLabel: 'Surname',
 name: 'person_surname',
 allowBlank: false,
 blankText: 'Please fill "' + this.fieldLabel + '" field',                  
},

(也不起作用)

更新:

例如,在minLengthText属性中,我可以使用模板驱动的文本,例如“此字段的最小长度为 {0}”,它采用minLength同一对象的属性值。

我再说一遍:我使用 ExtJS 的对象初始化方法,对象字面量语法如下:

{
 xtype: 'textfield',
 fieldLabel: 'Surname',
 name: 'person_surname',
 allowBlank: false,
 blankText: 'Please fill "Surname" field',                  
},

这种语法非常简洁,这里不欢迎使用其他语法。

4

8 回答 8

3

您需要创建对象,获取对它的引用,然后通过它的引用来扩充它。

var obj = {
 xtype: 'textfield',
 fieldLabel: 'Surname',
 name: 'person_surname',
 allowBlank: false
};

obj.blankText = 'Please fill "' + obj.fieldLabel + '" field';
于 2012-08-20T07:16:34.943 回答
1

如果您不想重写代码,请尝试在表单中添加侦听器

例子

listeners : {

               render : function(){
                   Ext.each(form.items.items,function(fld,idx){
                    if(fld.getXType()=='textfield'){
                       fld.blankText = fld.fieldLabel;
                    }
                   });
               }
 }
于 2012-08-20T07:33:29.780 回答
1

几种选择:

1)这个优于公认的答案,因为渲染侦听器是修改 DOM 相关对象属性的不良场所。它与渲染周期的工作方式有关,但之前更好,之后平均做,期间做不好。下面的一个可能仅适用于您处理的是字段的平面列表。

Ext.define('MyClass', {

    initComponent: function(){
        var fields = [{
            xtype: 'textfield',
            fieldLabel: 'Field 1'
        }, {
            xtype: 'textfield',
            fieldLabel: 'Field 2'
        }];

        Ext.Array.forEach(fields, function(field){
            field.blankText = 'Foo ' + field.fieldLabel
        });
        this.items = fields;
        this.callParent();
    }

});

2) 这为您提供了最大的控制权,再次,在定义字段后无需胡乱处理:

Ext.define('MyClass', {

    initComponent: function(){
        var wrap = this.wrap;

        this.items = [wrap({
            xtype: 'textfield',
            fieldLabel: 'Field 1'
        }), wrap({
            xtype: 'textfield',
            fieldLabel: 'Field 2'
        })];

        this.callParent();
    },

    wrap: function(config){
        config.blankText = 'Foo ' + config.fieldLabel;
        return config;
    }

});
于 2012-08-20T08:08:35.460 回答
0

我唯一能想到的是

new function(){
    this.xtype = 'textfield';
    this.fieldLabel = 'Surname';
    this.name = 'person_surname';
    this.allowBlank = false;
    this.blankText = 'Please fill "' + this.fieldLabel + '" field';                  
}
于 2012-08-20T07:14:36.807 回答
0

当你尝试做这些事情时,你有三个选择,真的:

var Object_1 = {};
Object_1.property_1 = "Something";
Object_1.property_2 = "I'm Really " + Object_1.property_1 + "!";


var Object_2 = {
    property_1 : "Something",
    property_2 : "I'm Really"
};

Object_2.property_2 += Object_2.property_1 + "!";


var Object_3 = (function () {
    var property1 = "Something",
        property2 = "I'm Really " + property1 + "!";

    return { property_1 : property1, property_2 : property2 };
}());

就用户定义的属性而言,这三个对象中的每一个最终都是等效的。就个人而言,我在 JavaScript 中大量使用#3,明确地避免您现在遇到的问题。

将属性和方法定义为函数中的变量,然后返回一个函数,然后该函数可以访问这些原始变量,或者返回一个对象(您可以将方法附加到该对象 - 只要方法是在原始函数内部定义的-- 可以访问内部变量)。

于 2012-08-20T07:27:24.000 回答
0

你写一个简单的解析器怎么样?

{
    xtype: 'textfield',
    fieldLabel: 'Surname',
    name: 'person_surname',
    allowBlank: false,
    blankText: 'Please fill [fieldlabel] field',                  
},

输出消息时,将宏替换[fieldlabel]为对象的.fieldLabel值。为您可能需要的其他内容添加其他宏。

于 2012-08-20T07:29:14.717 回答
0

如果您的代码在支持ECMAScript 5 Getters 和 Setters功能的浏览器中运行,您可以使用 getter 来实现您所需要的:

{
    xtype: 'textfield',
    fieldLabel: 'Surname',
    name: 'person_surname',
    allowBlank: false,
    get blankText(){ return 'Please fill "' + this.fieldLabel + '" field';}
},
于 2012-08-20T08:00:08.047 回答
0

您可以执行以下操作:

({
    xtype: 'textfield',
    fieldLabel: 'Surname',
    name: 'person_surname',
    allowBlank: false,
    init: function() {
        this.blankText = `Please fill ${this.fieldLabel} field`;
        ...
        delete this.init;
        return this;
    }
}).init()
于 2019-09-18T19:30:13.857 回答