初始化容器面板时无法在 Ext Js FormPanel 上调用 getValues()
我有一个 Ext Js 面板，我将其添加到我的主 TabPanel 中。我添加的面板包含一个 FormPanel 作为其项目之一，并且在 FormPanel 内部有一个名称字段。我想要做的是根据表单字段中的名称更改选项卡的名称。
问题是，如果我在面板的 initComponent 内部调用 FormPanel 的 getForm().getValues() ，则会收到以下 javascript 错误：
Uncaught TypeError: Cannot read property 'dom' of undefined
如果我在 initComponent 外部执行此操作（例如，按下按钮时）一切正常。经过一些测试后，我认为问题在于 FormPanel 尚未实际渲染（因此 dom 不存在），getValues() 失败。但是，我似乎无法找到在加载时从面板获取 FormPanel 值的方法。
我尝试监听事件。我尝试过：
this.detailForm.on('afterrender', function () { alert('test'); });
但这样做表明 AfterRender 在表单实际渲染之前被调用（它在屏幕上不可见）。将警报更改为我的自定义函数处理程序会产生之前的 dom 异常。我尝试使用 activate 和 enable 事件而不是 afterrender，但即使 API 说 FormPanel 会触发这些事件，alert(' test') 永远不会被调用。
我似乎找不到任何方法让我的面板在加载面板时获取内部 FormPanel 的值。有人有什么想法吗？
I have an Ext Js panel that I am adding to my main TabPanel. The panel I am adding contains a FormPanel as one of it's items and inside the FormPanel I have a Name field. What I want to do is change the name of the Tab based on the name in the form field.
The problem is that if I call the FormPanel's getForm().getValues() inside of the panel's initComponent, I get the following javascript error:
Uncaught TypeError: Cannot read property 'dom' of undefined
If I do this outside of initComponent (e.g. on a button press) everything works fine. After doing some testing, I think the issue is that the FormPanel isn't actually rendered yet (and thus the dom doesn't exist), getValues() fails. However, I can't seem to figure out a way to get my FormPanel's values from the Panel on load.
I tried to listen for events. I tried:
this.detailForm.on('afterrender', function () { alert('test'); });
but doing this showed that AfterRender is called prior to the form actually being rendered (it's not visible on the screen). Changing the alert to my custom function handler produces the previous dom exception. I attempted to use the activate and enable events instead of afterrender, but even though the API says that FormPanel fires those events, the alert('test') never gets called.
I can't seem to find any way for my panel to get the inner FormPanel's values upon loading my panel. Does anyone have any ideas?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
使用 getFieldValues() 代替 getValues() 将通过调用每个字段实例的 getValue() 方法而不是从 DOM 读取来收集值。这应该允许您获取值，无论表单的呈现状态如何。
Using getFieldValues() in place of getValues() will collect values by calling each field instance's getValue() method instead of by reading from the DOM. This should allow you to get your values regardless of the form's rendered state.
我的一个项目也遇到了同样的问题，我设法使用
afterlayout事件修复它。I've got the same problems on one of my projects, I managed to fix it using the
afterlayoutevent.我会尝试设置 .deferredRender:false 。
Ext.TabPanel.deferredRender
可能最好推出您的布局更改后，然后仅使用直接 deferredRender:false 配置项进行测试。
我认为这个问题是由于非活动选项卡在变为活动状态之前不会呈现而引起的。在您的场景中，您无法获取这些值，因为在激活/显示选项卡之前它们不存在。
设置 deferredRender:false 将渲染所有选项卡中的项目。设置 deferredRender:false 可能会影响性能，因此必须进行测试。
希望这有帮助。
I'd give setting .deferredRender:false a try.
Ext.TabPanel.deferredRender
Probably best to roll out of your afterlayout changes, then test with just a straight deferredRender:false config item.
I believe the problem is caused because the inactive tabs are not rendered until they become active. In your scenario, you cannot get the values, because they don't exist until the tab is activated/shown.
Setting deferredRender:false will render the items within all tabs. There could be a performance hit by setting deferredRender:false, so testing you must do.
Hope this helps.