Javascript 在javascript中获取primefaces widgetVar并更新它

Get primefaces widgetVar in javascript and update it

提问by Aditzu

I have a primefaces component like this:

我有一个像这样的primefaces组件：

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

and i'm trying to get the component in javascript context and update it.

我正在尝试在 javascript 上下文中获取组件并更新它。

I already tried with:

我已经尝试过：

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

or

或者

How to find a widgetVar?

如何找到一个widgetVar？

or

或者

Get widgetVar with JavaScript or check/uncheck all other PrimeFaces checkboxes

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

It will be great if I'll find a solution to take the widgetVar by class, but any other solutions are welcomed.

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

I also tried:

我也试过：

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

but I get an javascript error "'PrimeFaces.widgets.length' is null or not an object"

但我收到一个 javascript 错误“'PrimeFaces.widgets.length' is null or not an object”

Any ideas?

有任何想法吗？

回答by Kukeltje

There is not mapping between the id and a widgetVar for PrimeFaces 3.5. In 3.5 the widgets are added to the 'window' object and not stored somewhere else. This means that the widgetVar is already directly a variable u can use.

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

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

3.5/4.0:(in 4.0 this still works but is deprecated in favour of the PF('..') way) errorsPanelWidget.close()

3.5/4.0 ：（在 4.0 中这仍然有效，但已被弃用以支持 PF('..') 方式） errorsPanelWidget.close()

5.0 and up:PF('errorsPanelWidget').close()(unless you configure the legacy mode after which it will behave like 3.5/4.0)

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

Easiest is then to use a convention that you name your widgetVar like your id but with a postfix e.g. id_widget. You could (advise against it) leave the widgetVar out and then the widget is idententical to the id (this can cause classhes in cases, that is why PF dropped this convention).

最简单的方法是使用一个约定，将widgetVar 命名为您的id 之类的名称，但带有一个后缀，例如id_widget。您可以（建议不要这样做）将 widgetVar 留在外面，然后小部件与 id 相同（这可能会导致分类，这就是 PF 放弃此约定的原因）。

And you could still check if in 3.5 the widgetVar value is in one way or another added to the outer html element of the widget. You could then retrieve it with some jquery. Personally, I used the 'convention' way in previous PF versions (appending 'Widget' to the value that is also in the id and putting that in the widgetVar attribute)

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

And if with 'updating' the widget, you mean updating the content of the widget, you can't. There is no refresh()kind of method that does this. What you could do is send the id(!) to the server and execute an update(..)there via the requestContextlike this

如果“更新”小部件，您的意思是更新小部件的内容，则不能。没有refresh()一种方法可以做到这一点。你可以做的是将 id(!) 发送到服务器并update(..)通过requestContext这样的方式在那里执行

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

But it might be even better to just to this the moment you update the list serverside. So it might be that you've fallen into the XY trap.

但是在您更新列表服务器端的那一刻可能会更好。所以你可能掉进了XY陷阱。

But if it is really needed, here is an example that works, using the PrimeFaces extensions remoteCommandsince that is the easiest way)

但如果真的需要，这里是一个有效的例子，使用PrimeFaces 扩展 remoteCommand因为这是最简单的方法）

xhtml:

html:

<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);
    }
}

calling refreshWidget('errrosPanel'); will achieve what you want.

打电话refreshWidget('errrosPanel'); 将实现你想要的。

Don't wan't to use PFE (or can't use this due to version incompatibilities), you can achieve the same with PF remoteCommandBut the specific example for 3.5 might differ a little

不想用PFE（或者因为版本不兼容而不能用），可以用PF remoteCommand来实现，但是3.5的具体例子可能有点不同