ExtJs4, как рекурсивно отключить все поля и все кнопки на панели

Question

Я пытаюсь отключить все интерактивные редактируемые компоненты на моей панели.

Вызов panel.disable() не работает, но кнопки по-прежнему нажимаемы.Тот же результат дает panel.cascade с функцией, которая отключает каждый компонент.

Как правильно это сделать?

Answer 1

Если вы используете ExtJs 4.x , это то, что вы ищете -

myFormPanel.query('.field, .button').forEach(function(c){c.setDisabled(false);});

(Изменить селектор в зависимости от сложности формы. Вы можете простоиспользуйте .component и он отключит все компоненты в вашей форме)

См. также - Ext.ComponentQuery

Если вы используете 3.x , вы можете добиться того же эффекта в два этапа, как это -

myFormPanel.buttons.forEach(function(btn){btn.setDisabled(true);}); //disable all buttons
myFormPanel.getForm().items.each(function(itm){itm.setDisabled(true)}); //disable all fields

Answer 2

Предполагая, что вы использовали FormPanel, вы можете использовать этот метод для получения формы:

getForm() // see http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.Panel-method-getForm

Это вернет объект Ext.form.Basic. Отсюда у вас есть доступ ко всем полям в этой форме с помощью метода:

getFields() // see http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.Basic-method-getFields

Теперь cou может перебирать поле и отключать их. Обратите внимание также на метод applyToFields(), где вы можете передать свой объект. См. Информацию об API: http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.Basic-method-applyToFields

Удачи!

Answer 3

Это лучшее решение для отключения всех полей формы на панели формы.

var formPanelName = Ext.ComponentQuery.query('#formPanelId field');
for(var i= 0; i < formPanelName.length; i++) {
   formPanelName[i].setDisabled(true);
}

Просто получите ссылку на поля панели формы.Выполните итерацию по каждому полю и используйте функцию setDisabled, чтобы установить для его атрибута readOnly значение true.

Вы также можете расширить его и захватить всю панель формы.Это решение выше захватывает только отдельные разделы панели формы по ее идентификатору.extjs 4

Answer 4

Для тех, кто вручную добавляет наборы полей и поля на панель формы, ExtJS не требует, чтобы вы добавляли компоненты непосредственно в форму, выполняя сначала getForm ().Это в основном для удобства и позволяет стандартным функциям работать правильно.Поэтому, независимо от того, с какого компонента вы добавили ', выполните итерацию этого компонента.

Пример 1:

Обычно вам не следует использовать идентификатор для получения компонента.так как он установлен динамически.Но это показывает, как вы можете получить саму панель формы, используя getCmp.

            var formPanel = Ext.getCmp('id-of-component');
            var fieldSet = Ext.create('Ext.form.FieldSet', {
                title: 'field set'                    
            });
            formPanel.add(fieldSet);

При выполнении итерации вы должны сделать следующее:

formPanel.each(function(item) {
  alert(item.title);
});

Пример 2:

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

            var formPanel = Ext.getCmp('id-of-component');
            var fieldSet = Ext.create('Ext.form.FieldSet', {
                title: 'field set'                    
            });
            formPanel.getForm().add(fieldSet);

При выполнении итерации вы должны сделать это:

formPanel.getForm().each(function(item) {
  alert(item.title);
});