jsf - Change <p:commandButton> value with JavaScript - Stack Overflow

admin管理员组

文章数量:1356385

Is there any way to change a <p:mandButton> value with Javascript?

I tried to set a widgetVar in the <p:mandButton> but it doesn't have any setValue() function or something like this. I can't bind it to a managed bean due to other specific issues with my XHTML.

Is there any way to change a <p:mandButton> value with Javascript?

I tried to set a widgetVar in the <p:mandButton> but it doesn't have any setValue() function or something like this. I can't bind it to a managed bean due to other specific issues with my XHTML.

• javascript
• jsf
• jsf-2
• primefaces

Share Improve this question Follow edited May 11, 2012 at 4:28 BalusC 1.1m376376 gold badges3.7k3.7k silver badges3.6k3.6k bronze badges asked May 10, 2012 at 23:58 Adriano CastroAdriano Castro 1,48144 gold badges2020 silver badges3535 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

JSF generates HTML. JavaScript works with HTML. When writing JavaScript code, don't look too much at the JSF source code if you already can't tell form top of head what HTML code exactly it would generate.

Open the JSF page in your favourite browser, rightclick and View Source. The generated HTML output of a <p:mandButton value="foo" /> look like this:

<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>

Look, the button has a single <span> child with therein the value.

So, this piece of JS to change the button's value to bar should do:

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

This is a better way using the widgetVar :

lets say we set confirmWgt as the <p:mandButton> widgetVar, The javascript code to set its value will be :

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

Using this way, you are sure if any changes in the html code applied by primefaces in the future will not cause any problem in updating its version.

本文标签： jsfChange ltpcommandButtongt value with JavaScriptStack Overflow