在JavaScript中获取PrimeFaces小部件变量并更新它。

Question

在JavaScript中获取PrimeFaces小部件变量并更新它。

4

我有一个如下所示的PrimeFaces组件：

<p:panel styleClass="errorsPanelClass" id="errorsPanel" header="Messages" toggleable="true" effect="drop" toggleSpeed="0" closeSpeed="0" widgetVar="errorsPanelWidget">

我是一名能翻译文本的助手。

我正在尝试在JavaScript上下文中获取组件并对其进行更新。

我已经尝试过：

function getWidgetVarById(id) {
   for (var propertyName in PrimeFaces.widgets) {
     if (PrimeFaces.widgets[propertyName].id === id) {
       return PrimeFaces.widgets[propertyName];
     }
   }
}

或者

如何找到widgetVar？

或者

使用JavaScript获取widgetVar或选中/取消选中其他所有PrimeFaces复选框

如果我能找到一个按类获取widgetVar的解决方案，那就太好了，但欢迎任何其他解决方案。

我也尝试过：

function getWidgetVarById() {
    for ( var propertyName in PrimeFaces.widgets) {
        alert(PrimeFaces.widgets[propertyName].id);
    }
}

但我遇到了一个JavaScript错误，错误信息为"'PrimeFaces.widgets.length'为空或不是对象"

有什么想法吗？

- Aditzu

如果（只是为了测试）您执行 PF('errorsPanelWidget') 会发生什么？由于这应该起作用，如果确实如此，那么很奇怪，因为在内部它执行 PrimeFaces.widgets[widgetVar]，这将与长度的“null”或非对象相矛盾。 - Kukeltje

我用 alert(PF('errorsPanelWidget'));，但是出现了“对象预期”的错误 :( - Aditzu

那么你有一个完全不同的问题。你使用的PF版本是什么？alert(PrimeFaces.widgets)是什么意思？请发布一个最小但完全有效的xhtml示例。 - Kukeltje

我正在使用Primefaces 3.5。 - Aditzu

1

如果有影响的话，这个组件位于自定义的组件中，并且被用在另一个XHTML文件中。我检查过了，它已经正确地渲染出来了。 - Aditzu

显示剩余3条评论

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Kukeltje · Accepted Answer

在PrimeFaces 3.5中，ID和widgetVar之间没有映射关系。在3.5中，小部件会添加到“window”对象中，而不是存储在其他地方。这意味着widgetVar已经直接成为一个可以使用的变量。

<p:panel id="errorsPanel" widgetVar="errorsPanelWidget">

3.5/4.0:（在 4.0 中仍然有效，但已被弃用，推荐使用 PF('..') 的方式） errorsPanelWidget.close()

5.0 及更高版本: PF('errorsPanelWidget').close()（除非您配置了旧版模式，否则它将像 3.5/4.0 一样运行）

最简单的方法是按照惯例为 widgetVar 命名，例如 id_widget。您可以（不建议这样做）省略 widgetVar，此时小部件与 id 相同（在某些情况下可能会造成冲突，这就是 PF 放弃这种约定的原因）。

而且您仍然可以检查 3.5 版本中是否以某种方式将 widgetVar 值添加到小部件的外部 html 元素中。然后可以使用一些 jquery 检索它。个人而言，我在之前的 PF 版本中使用了“约定”方式（将“Widget”附加到也在 id 中的值中，并将其放在 widgetVar 属性中）。

如果“更新”小部件的意思是更新小部件的内容，则无法直接执行此操作。没有类似于 refresh() 的方法可以实现这一点。您可以将 id 发送到服务器并通过 requestContext 执行 update(..)，如下所示：

RequestContext context = RequestContext.getCurrentInstance();
context.update("errorsPanel");

但是，如果在服务器端更新列表时立即执行此操作可能会更好。因此，你可能已经陷入了XY陷阱。

但是，如果真的需要这样做，这里有一个可行的示例，使用PrimeFaces扩展远程命令，因为这是最简单的方法）

xhtml:

<pe:remoteCommand id="refreshWidgetCommand" name="refreshWidget" process="@this" actionListener="#{updateWidgetController.refresh}">  
    <pe:methodSignature parameters="java.lang.String"/>  
    <pe:methodParam name="id"/>  
</pe:remoteCommand>

Bean：

@ManagedBean  
@RequestScoped  
public class UpdateWidgetController {  

    public void refresh(final String id) {  

        RequestContext context = RequestContext.getCurrentInstance();
        context.update(id);
    }
}

调用refreshWidget('errrosPanel')将实现您想要的效果。

如果不想使用PFE（或由于版本不兼容而无法使用），则可以使用PF remoteCommand来实现相同的功能，但在3.5的具体示例中可能会有所不同。