Extjs在运行中为表单上的所有字段设置只读

Question

我尝试编写方法,为窗体上的所有字段设置readOnly属性.

我的代码:

Ext.override(Ext.form.Panel,{

setReadOnlyForAll: function(bReadOnly) {

    this.cascade(function(f) {
      if (f.isFormField) {
         f.setReadOnly(bReadOnly);
      }
    });
});

从Ext.form.Panel调用此方法:

this.setReadOnlyForAll(false); 

但这种方法工作得很慢.有人知道如何提高速度吗？谢谢!

Answer 1

cascade检查当前容器的每个子项(例如a Ext.form.Panel),这意味着您要检查当前子项是否为表单字段.因此,使用Ext.form.Basic.getFields方法获取每个表单字段:

Ext.define ('Your_form_Panel', {
  extend: 'Ext.form.Panel' ,
  setReadOnlyForAll: function (bReadOnly) {
    this.getForm().getFields().each (function (field) {
      field.setReadOnly (bReadOnly);
    });
  }
});

此外,我建议你用Ext.define而不是Ext.override.

Answer 2

我仍然经历了9秒的延迟,在Wilk的建议(使用ExtJS 4.1.1a)的表格(带有嵌套形式)上将〜90个字段设置为readOnly.

为了进一步改进并从9秒减少到<1秒,我添加了对Ext.suspendLayouts()和Ext.resumeLayouts()全局变量的调用,以允许框架批处理组件布局.

Ext.define('My.Panel', {
  extend: 'Ext.form.Panel',

  setReadOnlyForAll: function(readOnly) {
    Ext.suspendLayouts();
    this.getForm().getFields().each(function(field) {
      field.setReadOnly(readOnly);
    });
    Ext.resumeLayouts();
  }
});