Search code examples
extjsextjs4

ExtJs4 how to disable all fields and all buttons on a panel recursively

I'm trying to disable all clickable, editable components on my panel.

Calling panel.disable() grays it out, but buttons are still clickable. The same result gives panel.cascade with a function that disables each component.

What is the right way to do this?

Solution

  • If you are using ExtJs 4.x, this is what you are looking for -

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

    (Modify your selector based on the complexity of your form. You can just use .component and it will disable all component in your form)

    See also - Ext.ComponentQuery

    If you are using 3.x, you can achieve the same effect in two steps like this -

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