模糊/单击 Formpanel ExtJS 4 无法正确访问表单字段

Question

我有一个 ExtJS Formpanel，并且我已经为表单（不是在表单的任何字段上）的点击编写了一个监听器，它工作正常。

1. 即使将 Ext.FocusManager.Enable() 设置为 true，我也无法让“模糊”均匀工作。我错过了什么？

2. 我无法从表单面板单击事件的事件处理程序访问表单字段。当我这样做时 - this.up.('form').get.(fieldname).value [在表单字段的事件处理程序中工作正常。]它说元素未定义。如何在此处访问表单元素？

添加代码 sn -p -

// Call it Object A     
Ext.create.('Ext.form.Panel', {

       id : xyz,


       items: [
       {
          xtype : 'textfield',
          name : 'test',
          fieldLabel : 'Name'
    }

    listeners : { // listener on the formPanel; not on any of its element
      click : {
            console.log("this works" );
     },
     focus : {
            console.log('this does not work');
    }

    }
    ]


    }

我这样做是为了访问另一个对象的值，比如 B.field。

Onload 我能够获取 B.field 的值。但是当用户更改不同选项卡上的 B.field 的值时，我无法获取 A 中 B.field 的更改值。我只是想办法避免 Ajax 调用数据库，如果可能的话.

提前感谢您的宝贵时间。

Answer 1

如果您的代码中没有任何示例可供参考，很难确定您要做什么。

您可能只需要修改查询表单元素的方式。例如，工具栏中的元素不是表单的子元素，因此 up/down 不起作用。

我认为您无法在表单上收听事件 focus、blur 或 click。即使可以，我也不确定您是否愿意。相反，更常见的是在字段上侦听 focus 或在按钮上侦听 click。

示例 1 表单，其中字段使用 focus，按钮使用 click

http://codepen.io/anon/pen/qEPRge?editors=001

;(function(Ext) {
  Ext.onReady(function() {
    console.log("Ext.onReady")

    var form = new Ext.create("Ext.form.Panel", {
      title: "person"
      ,items: [
        {itemId: "fld-id", fieldLabel: "id", name: "id", value: "1", xtype: "textfield", labelAlign: "top", labelSeparator: ""}
        ,{itemId: "fld-name", fieldLabel: "name", name: "name", value: "Emily", xtype: "textfield", labelAlign: "top", labelSeparator: ""}
        ,{itemId: "btn-submit", text: "submit", xtype: "button"}
      ]
    })
    form.on("afterrender", function(component) {
      console.log("form.afterrender")
    })
    form.render(Ext.getBody())

    form.queryById("fld-id").on("focus", function(component) {
      console.log("fld-id.focus")
    })

    form.queryById("fld-name").on("focus", function(component) {
      console.log("fld-name.focus")
    })

    form.queryById("btn-submit").on("click", function(component) {
      console.log("btn-submit.click")
      console.log("fld-id.value:")
      console.log(component.up("form").queryById("fld-id").getValue())
      console.log("fld-name.value:")
      console.log(component.up("form").queryById("fld-name").getValue())
    })
  })
})(Ext)