改变<p:commandButton> JavaScript 的价值

Question

有没有办法用 Javascript 更改<p:commandButton>值？

我试图在<p:commandButton>设置一个widgetVar ，但它没有任何setValue()函数或类似的东西。 由于 XHTML 的其他特定问题，我无法将其绑定到托管 bean。

Answer 1

JSF 生成 HTML。 JavaScript 与 HTML 一起使用。 在编写 JavaScript 代码时，如果您已经无法告诉 form top 它将生成什么 HTML 代码，请不要过多地查看 JSF 源代码。

在您喜欢的浏览器中打开 JSF 页面，右键单击并查看源代码。 <p:commandButton value="foo" />生成的 HTML 输出如下所示：

<button id="formId:buttonId" name="formId:buttonId" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" onclick="PrimeFaces.ab({formId:'formId',source:'formId:buttonId',process:'@all'});return false;" type="submit">
    <span class="ui-button-text">foo</span>
</button>

看，按钮有一个<span>子元素，其中包含值。

因此，这段将按钮的值更改为bar的 JS 应该执行以下操作：

document.getElementById("formId:buttonId").firstChild.innerHTML = "bar";

Answer 2

这是使用 widgetVar 的更好方法：

假设我们将confirmWgt设置为<p:commandButton> widgetVar，设置其值的javascript代码将是：

PF('confirmWgt').jq.text("New Value");

使用这种方式，您可以确定将来primefaces 应用的html 代码中的任何更改不会导致更新其版本的任何问题。