How to call two methods on button's onClick method in Vf Page?

Question

I am having two functions one is java script function named as Capturing Signature() and anther one apex class function named as savePDF(). I am trying to call this two methods on button's onClick method in VF Page. For this so far i have tried this.

**This code calling only one method "SavePDF()"**
      <input id="saveSigButton" type="button" name="SigCap" onclick="CaptureSignature();savePDF();" value="Submit"/ >

*This code calling only one method "CaptureSignature()"**

      <input id="saveSigButton" type="button" name="SigCap" onclick="CaptureSignature(),savePDF()" value="Submit"/ >

Kindly help to resolve this.Thanks in advance

Answer 1

To call apex class (controller) function named savePDF(), use apex:commandButton component with action attribute binding set to {!savePDF}, calling the savePDF() method of the underlying controller:

<apex:commandButton action="{!savePDF}" value="Save" id="theButton" />

To call JS function named CaptureSignature() on click of the button, use apex:commandButton with onclick attribute set to CaptureSignature();:

<apex:commandButton onclick="CaptureSignature();" value="Save" id="theButton" />

To call both, the controller method as well as the JS function, use apex:commandButton with both action and onclick attributes set:

<apex:commandButton action="{!savePDF}" onclick="CaptureSignature();" value="Save" id="theButton"  />

Answer 2

you can user to call Apex function in VF page. for example:

<apex:actionFunction name="savePDF" action="{!savePDF}" rerender="out" status="myStatus"/>

<apex:commandButton action="{!save}" value="Save" id="theButton" onclick="savePDF(),CaptureSignature()"/>

for more reference

Java script functions you can invoke normally.

Answer 3

You can use apex function with java-script to implement this :

<apex:actionFunction name="savePDFApex" action="{!savePDF}" />

<script type="text/javascript">
function CaptureSignature() {
/*
do what you want to do.
*/
savePDFApex();
}

</>

<apex:commandButton value="Save" id="theButton" onclick="CaptureSignature()"/>

Answer 4

<apex:actionFunction name="savePDF" action="{!savePDF}" rerender="out" status="myStatus"/>

<apex:commandButton action="{!save}" value="Save" id="theButton" onclick="savePDF()"/>

use ActionFunction for calling two methods on single command button click. onclick event runs the ActionFunction and the second method will be called