Visualforce page - run javascript when clicking button

Question

This is the first Visualforce page I am creating, so this might be a very simple question.

Previously I had a custom button on a custom object and I set behaviour to "execute javascript" and content source to "onclick javascript".

The code I was running was (returns Text)

{!REQUIRESCRIPT("/soap/ajax/10.0/connection.js")}
{!REQUIRESCRIPT("/soap/ajax/10.0/apex.js")}
sforce.apex.execute("NotificationsWebservice","sendAnEmail", {diseaseId:"{!Disease__c.Id}"});
window.alert("Email was sent." );

So now I decided to create a Visualforce page which contains a button.

<apex:commandButton action="JAVA SCRIPT NEEDS TO GO HERE I THINK" value = "Send an email"/>

The question now is, how do I call a class by pressing a button on a Visualforce page?

Thanks in advance.

Answer 1

You could use JS on the VF page to call that WebService method but I would set up a button action method in your VF page controller to call it, like so:

<apex:commandButton action="{!sendEmail}" value = "Send an email"/>

and in your controller:

public void sendEmail () {

    NotificationsWebservice.sendAnEmail(diseaseId);
}

Obviously you will need the diseaseId property to be in your controller & populated correctly.

Answer 2

If you are new to Visualforce developement, have a look at An Introduction to Visualforce and it explain the usage, how to call controllers(classes as you have mentioned) and lot more details nicely step by step. In brief, to call your class from the visualforce page set the controller attribute to your class as below.

<apex:page controller="your_ctrl" >
  ...
  <apex:form>
     <apex:commandButton action="{!ctrl_function}" value = "Send an email"/>
  </apex:form>
</apex:page>

your_ctrl in above snippet is the name of your class. Refer above link for more details. Whenever you add this attribute, fields and methods are visible(if they public or global) to the page and you can set, get them as well as rerender the page upon any update for those fields.

To call any JS function just in the client side as in normal HTML button you can simply call it in the onclick event of the button

<apex:commandButton onclick="yourJS();" value = "Send an email"/>