如何在渲染后更改Ext Js组件的配置属性

时间:2013-09-07 19:23:10

标签: javascript extjs

有些情况下我必须在渲染后更改Ext Js组件的某些配置属性。在Api文档中,我没有看到大多数配置的getter / setter。有没有办法更改配置然后重新渲染组件或更新布局?

在下面的代码中,我需要在呈现Ext.form.FieldSet之后动态地将collapsible属性更改为true或false:

 var container = Ext.create("Ext.container.Container", {
     renderTo: Ext.getBody(),
     layout: {
         type: "vbox"
     }
 });

 var fieldset = Ext.create("Ext.form.FieldSet", {
     renderTo: "fieldset"
 });

 var text = Ext.create("Ext.form.field.Text", {
     renderTo: "text"
 });

 var button = Ext.create("Ext.Button", {
     renderTo: "button",
     text: "My Button"
 });

 fieldset.add(text);
 fieldset.add(button);

 container.add(fieldset);

以下代码也不会更新布局:

 Ext.apply(fieldset,{collapsible:true,style:"bakground:red"});

http://jsfiddle.net/2nyhE/

2 个答案:

答案 0 :(得分:0)

fld.titleCmp.el.on({
    'click': fld.toggle,
    scope: fld
});

fld.titleCmp.el.addCls(me.baseCls + '-header-text-collapsible');

fld.legend.items.add(fld.createToggleCmp());
fld.legend.updateLayout();

http://jsbin.com/IFUZut/1/

答案 1 :(得分:-1)

您可以在字段集上调用方法collapseexpand来折叠或展开它。

你可以试试这个。为所需的字段集(id:'anyId')设置ID属性,然后使用Ext.apply(Ext.getCmp('anyId'), {your config object});

Ext.applay documentation

您可以看到此post

此外,您还可以了解Ext.apply与添加here的简单javascript参数之间的区别。