如何在表单布局中创建最初隐藏的字段？

Question

是否可以在最初隐藏的表单布局中创建字段（完全包括字段标签）？

我不想在渲染后为这些字段调用cmp.getEl().up('.x-form-item').setDisplayed [1]因为它会导致闪烁和其他“效果”。

[1]我知道这是隐藏表格字段的唯一方法，包括标签。

Answer 1

您可以将表单字段的xtype设置为隐藏。所以，你会有这样的事情：

{
id:'my_field_id',
name: 'my_field_name',
xtype: 'hidden'
}

您可以添加如下字段：

Ext.getCmp("myFormPanel").add({
    id:'my_field_id',
    name: 'my_field_name',
    xtype: 'textfield'
    });
Ext.getCmp("myFormPanel").doLayout();

然后将其删除：

Ext.getCmp("myFormPanel").remove(Ext.getCmp("my_field_id"));
Ext.getCmp("myFormPanel").doLayout();

我希望这就是你想要的。

Answer 2

当然，在文档中创建一个CSS类（根据您的需要）'display：none'OR'visibility：hidden'。把这个课称为'隐形课'。

使用'display：block'，'display：inline'或'visibility：visible'创建另一个类，并将此类称为'visible-class'。

对于表单字段，您希望在呈现时将其“cls”属性设置为“invisible-class”，即：

cls:'invisible-class'

当您希望该字段可见时，请使用以下方法：

addCls('visible-class')

ALTERNATIVELY-当您想要使项目可见时，请使用以下方法：

removeCls('invisible-class')

即。 mycomponent.removeClass（ '不可见级'）

希望这有帮助！

Answer 3

如果您只需要隐藏此单个字段及其字段标签，则可以使用更简单的方法为其创建单独的标签对象。隐藏标签可能更容易，而不是处理CSS来隐藏fieldLabel。

您可以将一个侦听器添加到布局管理面板的render事件中，以执行类似这样的操作...

  

var cmp = Ext.getCmp（fieldID）;

if((cmp.hidden) && cmp.previousSibling() != null) 
   && (cmp.previousSibling().xtype =='label'){
   cmp.previousSibling().hide(); 
}