Установить и удалить свойство readonly в ext Js

В extJs мне нужно отключить одно поле, пока не будет нажата кнопка редактирования.

xtype:'textfield',
fieldLabel: 'Address',
name:'streetAddress',
labelWidth: 48,                         
maxLength: 100,                         
cls: 'appAddresscls',
id: 'resume-applicantdetails-view-address',
allowBlank : false,
//readOnly:true,
skipValue:true

При загрузке позвонил

Ext.getCmp('resume-applicantdetails-view-address').getEl().dom.setAttribute('readOnly', true);

При редактировании

Ext.getCmp('resume-applicantdetails-view-address').getEl().dom.removeAttribute('readOnly');

Но поле всегда находится в режиме редактирования. На самом деле я пробую это, потому что отключенные поля в IE отображаются серым цветом.


person Sarika.S    schedule 31.07.2012    source источник


Ответы (5)


xtype:'textfield',
fieldLabel: 'Address',
name:'streetAddress',
labelWidth: 48,                         
maxLength: 100,                         
cls: 'appAddresscls',
id: 'resume-applicantdetails-view-address',
allowBlank : false,
readOnly:false,
skipValue:true

При загрузке позвонил

Ext.getCmp('resume-applicantdetails-view-address').setReadOnly(true);

При редактировании

Ext.getCmp('resume-applicantdetails-view-address').setReadOnly(false);
person Sarika.S    schedule 01.08.2012

Вы можете оставить disabled: true и добавить на свою страницу следующий CSS-код, чтобы такие поля выглядели нормально, как другие:

.x-item-disabled .x-form-item-label,
.x-item-disabled .x-form-cb-label {
     filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
     opacity: 0.9; 
 }

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

person netemp    schedule 31.07.2012

Установите отключенное поле: true в config, а затем в функции вызова кнопки редактирования для renable.

Ext.getCmp('resume-applicantdetails-view-address').setDisabled(false);
person gunnx    schedule 31.07.2012
comment
При отключении он снова станет серым. - person Sarika.S; 31.07.2012
comment
Вы хотите сказать, что не хотите, чтобы поля были серыми? Если нет, то примените стиль, используя параметр fieldClass: config, чтобы изменить это. - person gunnx; 31.07.2012

Чтобы отключить:

Ext.get('resume-applicantdetails-view-address').set({disabled:'disabled'});

Чтобы снять отключение:

Ext.get('resume-applicantdetails-view-address').set({disabled:''});
person kbhuvana    schedule 25.10.2013

Это помогает изменить свойство readOnly во время выполнения:

component.el.dom.readOnly = true; 
person Vishnu Suresh    schedule 13.08.2017