Extjs set readOnly option when button clicked

Question

Good day! I am try to write method, which set(true or false) readOnly option on the elements on form, when button clicked:

Ext.override(Ext.form.Panel,{

  setReadOnly: function(bReadOnly) {

    this.items.each(function(f){

     if (f instanceof Ext.form.FieldSet) {
       f.items.each(function (f) {

       if (f.isFormField) {
          if (bReadOnly === true) {
            f.inputEl.dom.setAttribute('readonly', true);
          } else {
            f.inputEl.dom.removeAttribute('readonly');
          }              

          if (f instanceof Ext.form.TriggerField)
          {                
            f.setDisabled(bReadOnly);                

            if (f instanceof Ext.form.ComboBox)
            {
              f.setEditable(bReadOnly);
            }
          }
        }
    });
    }
  });
});

On the textfield this code works perfect. But on the TriggerField i can not show trigger, when set readOnly option in false.Can Anybody help me?

Answer 1

You probably want the TriggerField setReadonly method

See the API reference here: http://docs.sencha.com/ext-js/3-4/#!/api/Ext.form.TriggerField-method-setReadOnly

You shoudln't need to manually alter the DOM, there are ExtJs methods available to do what you require.

Also, you can use the Panel findByType method to get all the form fields inside your panel.

http://docs.sencha.com/ext-js/3-4/#!/api/Ext.form.FormPanel-method-findByType