Как создать изначально скрытое поле в макете формы?

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, чтобы скрыть fieldLabel.

Возможно, вы сможете добавить прослушиватель к событию рендеринга панели управления макетом, чтобы сделать что-то вроде этого ...

var cmp = Ext.getCmp (fieldID);

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

Answer 3

Конечно, создайте CSS-класс в вашем документе с помощью (в зависимости от ваших потребностей) «display: none» ИЛИ «visibility: hidden». Назовите этот класс, скажем, «невидимый класс».

Создайте другой класс с помощью 'display: block', 'display: inline' ИЛИ ​​'visibility: visible' и назовите этот класс 'visible-class'.

Для поля формы, которое вы хотите быть невидимым, когда оно отображается, вы должны установить для его свойства cls значение invisible-class, т.е.

cls:'invisible-class'

А когда вы хотите, чтобы поле было видимым, используйте метод:

addCls('visible-class')

АЛЬТЕРНАТИВНО - если вы хотите сделать элемент видимым, используйте метод:

removeCls('invisible-class')

т.е. mycomponent.removeClass ( 'невидимый класс')

Надеюсь, это поможет!