文档准备就绪时访问PrimeFaces小部件变量

Question

我正在尝试在文档准备就绪时访问PrimeFaces组件，如下所示：

$(function() {
  var showDialog = getUrlParameter("showDialog");
  if (showDialog == "true") {
    PF('myDialog').show();
  }
});

但是在那一刻，primefaces widgetvars不可用，我会收到以下错误信息：

Widget for var 'myDialog' not available!

在PrimeFaces 6.2和7.0（以及可能的一些早期版本）中，您会收到以下错误消息：

TypeError: PF(...) is undefined

但是当使用PrimeFaces.widgets['myDialog'].show()而不是PF('myDialog').show();时，错误是相似的：

TypeError: PrimeFaces.widgets.myDialog is undefined

primefaces widgetvars何时准备好可以被访问？

- Josema

Answer 1

我在将javascript初始化代码添加到带有widgetVar的组件后的页面中获得了成功，即

<p:dataTable widgetVar="test">

</p:dataTable>

<script  type="text/javascript">
  $(document).ready(function()  {
     PF('test'); // access and do whatever here
 }
</script> 

将脚本标签放在p:dataTable之前是无效的。

更多信息请参见：http://forum.primefaces.org/viewtopic.php?f=3&t=35718。

- GreenieMeanie

---

你忘记在 } 后面加上 ); 完整的 JavaScript 代码应该是： $(document).ready(function() { PF('test'); // 在这里访问并执行操作 }); - Alexander Bering

Answer 2

有时候 widgetVar 需要在 document.ready 中初始化一些时间（不是很长），例如（非详尽）：

• 上传
• 对话框
• 覆盖层

在这种情况下，你可以使用 setTimeOut。

setTimeout(PF('myDialog').show(), 2000);

希望这能帮到你。

- Hatem Alimam

---

你是不是想说 setTimeout(function() { PF('myDialog').show();},2000)？ - Kukeltje

Answer 3

我找到了一个更好的解决方案。我使用h:body标签的onload属性调用了一个JavaScript方法。

<h:body onload="checkIfShowDialog()">

这是使用 JavaScript 的方法：

function checkIfShowDialog(){
  var showDialog = getUrlParameter("showDialog");
  if (showDialog == "true") {
    PF('myDialog').show();
  }
}

这个按预期工作。

- Josema

---

我知道已经过了很长时间，但您能否在问题和答案中添加您使用的PrimeFaces版本？这似乎不再适用于最近的PrimeFaces版本... - Kukeltje

或许是因为你的页面加载比较缓慢，所以当onload运行时，对话框小部件已经被初始化了。 - Kukeltje

我在这方面取得了成功，所以可能是特定情况下的。仍然值得一试。 - squaregoldfish

Answer 4

如果您在使用p:remoteCommand时，将autoRun="true"设置为如下所示，并遇到此错误：

<h:body>
    <h:form>
        <p:remoteCommand autoRun="true" name="actualizarSaldosCajero"
            onstart="PF('ajaxStatus').show();"
            action="#{plantillaGeneralMB.actualizarSaldosCajero}" />
    </h:form>

    <p:dialog widgetVar="ajaxStatus">
       Content
    </p:dialog>
</h:body>

您应该将p:remoteCommand代码放在您在onstart中引用的组件之后，或者放在您从那里调用的函数中。

<h:body>
    <p:dialog widgetVar="ajaxStatus">
       Content
    </p:dialog>

    <h:form>
        <p:remoteCommand autoRun="true" name="actualizarSaldosCajero"
            onstart="PF('ajaxStatus').show();"
            action="#{plantillaGeneralMB.actualizarSaldosCajero}" />
    </h:form>

</h:body>

尝试使用PrimeFaces 6.2和7.0。

- Kukeltje

Answer 5

您可以尝试使用RequestContext从服务器端调用JavaScript初始化方法。

RequestContext.getCurrentInstance().execute("initialization script here");

例如：

@PostConstruct
public void init() {
    if(!FacesContext.getCurrentInstance().isPostback()) {
        RequestContext.getCurrentInstance().execute("alert('This onload script is added from backing bean.')");
    }
}

参考：在页面加载完成后执行JavaScript

- Oskars Pakers