How do i invoke a java script function when clicking on command button in prime faces

Question

My requirement is to validate Ui component values using java script function. i would like to invoke backing bean method, once the validation is successful. How can i make it possible this requirement using primefaces 2.2 and java script. Here is the sample piece of code that i am using:

<p:commandButton id="saveButton" value="#{msgs['button.save.label']}"
    image="ui-icon #{msgs['button.save.icon.class']}" 
    actionListener="#{testBean.saveValues}"/>

why javascript? validation is built in, for cross validation, there is a workaround. Cross validation — phanneman
– phanneman, Commented Mar 27, 2012 at 16:50
Somehow jsf messages are not displaying in primefaces dialog window. I am not sure, if there is any bug in 2.2 version. — Sydaiah
– Sydaiah, Commented Mar 28, 2012 at 13:58
Doing validation by JavaScript instead of using JSF builtin validation is a terribly bad idea. You need to ask a question how to fix the real problem instead of asking how to get a hack/workaround to work. — BalusC
– BalusC, Commented Mar 29, 2012 at 13:50

Daniel · Accepted Answer · 2012-03-29 13:13:55Z

1

If you want to stop your actionListenerfrom being executed just return false in your js function of the button

this button won't execute the actionListener

<p:commandButton id="saveButton" value="#{msgs['button.save.label']}"
image="ui-icon #{msgs['button.save.icon.class']}" 
actionListener="#{testBean.saveValues}" onclick="return false;"/>

this will...

    <p:commandButton id="saveButton" value="#{msgs['button.save.label']}"
image="ui-icon #{msgs['button.save.icon.class']}" 
actionListener="#{testBean.saveValues}" onclick="return true;"/>

instead of hard coded onclick call your js function onclick=myJsValidation() it all depends on the return value of the js function

answered Mar 29, 2012 at 13:13

Daniel

37.2k10 gold badges123 silver badges208 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

rags · Accepted Answer · 2012-03-29 12:46:34Z

0

In error case of your saveValues:

FacesContext.getCurrentInstance().addMessage("ERROR_MESSAGE", new FacesMessage(FacesMessage.SEVERITY_INFO, "Error Message", "Error Message"));

In your xhtml, add update attribute for commandButton:

<p:growl id="growl_ID"/>
<p:commandButton value="Save" actionListener="#{testBean.saveValues}" update="growl_ID"/>

answered Mar 29, 2012 at 12:46

rags

2,59020 silver badges38 bronze badges

Collectives™ on Stack Overflow

How do i invoke a java script function when clicking on command button in prime faces

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related