javascript - 如何检查是否富有 :component returns null

Question

我有一个ui:composition称为 pageContent.xhtml，包含在另一个 ui:composition 中和一个 rich:popupPanel (两个不同的页面)。

pageContent.xhtml 包含 a4j:commandButton 。在 oncomplete按钮的方法 我想仅当 pageContent.xhtml 显示在 rich:popupPanel 上时才执行 javascript 。所以我想检查 pageContent.xhtml 是否 rich:popupPanel可用。

富人面孔 documentation描述 rich:component返回null ，如果未找到指定的组件标识符。

出于测试原因，我在 oncomplete 中执行以下 JS a4j:commandButton的方法:

console.log('-> ' + #{rich:component('popupPanelId')});

如果 pageContent.xhtml 显示在弹出窗口上(id 'popupPanelId' 可用)并且我单击按钮，我会在控制台上看到以下结果:

-> BaseComponent, PopupPanel

如果pageContent.xhtml显示在另一个ui:composition页面(id 'popupPanelId' 不可用)并单击按钮，收到以下错误消息:

try {console.log('-> ' + );;} catch (e) {window.RichFaces.log.error('Error in me...

如果是#{rich:component('popupPanelId')}未找到该组件 没有任何内容返回到结果页面，而不是 null .

如何检查组件是否可用且没有任何错误？

Answer 1

EL表达式在服务器上进行计算，然后将结果转换为要在页面上输出的字符串，null将转换为空字符串。

所以你可以从空检查开始:

oncomplete="#{rich:component('popupPanelId') == null ? 'alert(\'not found\')' : 'alert(\'found\')'}"

另一方面，我假设 popupPanel 是基于某些条件包含的，更好的方法是让 @oncomplete 检查相同的条件。否则，如果它没有渲染，函数会找到它。