改變<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 代碼中的任何更改不會導致更新其版本的任何問題。