在准备好文档时访问 primefaces 小部件变量答案

【问题标题】：Access to primefaces widgetvars on document ready在准备好文档时访问 primefaces 小部件变量
【发布时间】：2014-04-14 12:59:05
【问题描述】：

我正在尝试访问准备好的文档中的 primefaces 组件，如下所示：

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

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

var 'myDialog' 的小部件不可用！

在 PrimeFaces 6.2 和 7.0（可能还有一些早期版本）中，您得到的错误是

TypeError: PF(...) 未定义

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

TypeError: PrimeFaces.widgets.myDialog 未定义

primefaces 小部件变量何时可以访问？

【问题讨论】：

标签： jquery primefaces

【解决方案1】：

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

<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

【讨论】：

你不见了 );在 } Complete JavaScript 之后是： $(document).ready(function() { PF('test'); // 在此处访问并执行任何操作 });

【解决方案2】：

我为我的情况找到了更好的解决方案。我使用h:body 的onload 属性调用JavaScript 方法

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

这是 JavaScript 方法：

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

这可以按需要工作。

【讨论】：

我知道已经很久了，但是您可以将您使用的 PrimeFaces 版本添加到问答中吗？对于最近的 PrimeFaces 版本，这似乎不再有效......
或者您的页面加载速度相对较慢，因此当onload 运行时对话框小部件已经初始化
我在这方面取得了成功，所以它很可能是针对特定情况的。还是值得一试的。

【解决方案3】：

有时 widgetVar 需要一些时间来初始化（在 document.ready 中），例如（非扩展）

上传
对话框
叠加

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

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

希望这会有所帮助。

【讨论】：

你的意思是setTimeout(function() { PF('myDialog').show();},2000)？

【解决方案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 上试用过）

【讨论】：

【解决方案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.')");
    }
}

参考：Execute javascript onload

【讨论】：