代码之家  ›  专栏  ›  技术社区  ›  Zango

Extjs在呈现字段后更改fieldLabel。有更好的解决办法吗?

  •  18
  • Zango  · 技术社区  · 14 年前

    我研究了ExtJs如何在dom中呈现表单字段。为了在字段呈现后更改fieldLabel,我找到合适的dom元素并更改其innerHTML;

    /**
    * Modifies field's label afrer field is rendered.
    *
    * @param {object} field
    *    Some object that directly or indirecty extends Ext.form.Field
    * @param {String} label
    *    New value for field's label.
    */
    function setLabel(field,label){
        var el = field.el.dom.parentNode.parentNode;
        if( el.children[0].tagName.toLowerCase() === 'label' ) {
            el.children[0].innerHTML =label;
        }else if( el.parentNode.children[0].tagName.toLowerCase() === 'label' ){
        el.parentNode.children[0].innerHTML =label;
        }
        return setLabel; //just for fun
    }
    
    //EXAMPLE:
    var win = new Ext.Window({
        height : 200,
        width : 300,
        layout : 'form',
        labelAlign : 'right',
        items : [{
            xtype : 'textfield',
            fieldLabel : 'name',
            ref : 'f',
            html : 'asdf'
        },{
            xtype : 'datefield',
            fieldLabel : 'date',
            ref : 'd'
        },{
            xtype : 'combo',
            fieldLabel : 'sex',
            ref : 'c',
            store : [[1,"male"],[2,"female"]]
        },{
            xtype : 'radio',
            fieldLabel : 'radio',
            ref : 'r'
        },{
            xtype : 'checkbox',
            fieldLabel : "checkbox",
            ref : 'ch'
        }]
    }).show()
    
    setTimeout(function(){
       setLabel(win.f,'Last Name')(win.d,'Birth Date')(win.c,'Your Sex')(win.r,'jus radio')(win.ch,'just checkbox');
    },3000);
    
    6 回复  |  直到 14 年前
        1
  •  23
  •   David Young    11 年前

    访问dom来动态更改fieldLabels是3.0.1之前的版本

    在3.0.1之后,我相信这是可行的

    field.labelEl.update('New label');
    

    只能在渲染字段后执行此操作。

        2
  •  12
  •   Juan Ramón    12 年前

    如果您想用HTML添加标签,extjs4的最佳解决方案是使用update方法(update方法在labelEl中,而不是在label中):

    field.labelEl.update('新标签');

        3
  •  5
  •   Maruccio    13 年前

    在Ext 4的field对象中找不到label属性

    field.labelEl.dom.innerText = 'New Label';
    
        4
  •  4
  •   NDM    11 年前

    我刚刚遇到了同样的问题,但在我的情况下,标签可能已经呈现,或者没有。所以我必须涵盖这两种情况:

    var newLabel = 'new label';
    if (!field.rendered) field.fieldLabel = newLabel;
    else field.label.update(newLabel);
    

    我在extjs3.2中测试了它

        5
  •  4
  •   Klors    9 年前

    field.setFieldLabel('New Label');

        6
  •  0
  •   mdml kkappel    11 年前

    在extjs3.4.0中,函数的第一行不起作用。

    替换为:

    //var el = field.el.dom.parentNode.parentNode;
    var el = Ext.getCmp(field).getEl().dom.parentNode.parentNode;