How to call the apex form the Javascript Popup

Question

I have used following the code in my Onclickjavascript(custom button).

I have used two buttons in his pop and I would like to call the apex method from here.So, kindly let me know how to achieve this?

Code:

{!REQUIRESCRIPT('/soap/ajax/26.0/connection.js')} 
    var j$ = jQuery.noConflict();
    var iframe_url =  '{!URLFOR("/apex/apexpage")};
    var j$modalDialog = j$('<div id="opppopup"></div>')
    .html('<div align="center" style="margin-bottom:5px;"><input type="button" value="Save" class="btn" style="width:50px;"/>

<input type="button" value="Update" class="btn" /></div>



    <iframe  />') 

    .dialog({ 
    autoOpen: false, 
    title: 'PDF Preview', 
    resizable: true, 
    width: 800, 
    height: 540, 
    autoResize: true, 
    modal: true, 
    draggable: true 
    });

Apex method:

Public Class TestMethod(){        
    Public void Update(){

    }        
}

How to call the "Update" method when click the button in the above javascript frame code?

Answer 1

You can achieve by using the java script remoting.

http://www.salesforce.com/us/developer/docs/pages/Content/pages_js_remoting.htm

Answer 2

There are several ways to do this.

1. Using JavaScript Remoting
2. Using <apex:actionFunction />

If you go with <apex:actionFunction /> add following line in your VF page

<apex:actionFunction action="{!update}" name="callJS" />
<input type="button" value="Update" onclick="callJS();" class="btn" />

This will trigger your Update() function in the controller.

Based on your requirement you can decide what option to be selected. Basically if you need to manage post back and rerender some areas upon the postback, you have to go with <apex:actionFunction /> while remote call methods call back functions handle it asynchronously.

Answer 3

If want to call apex from Javascript then you'll need to make your class global and your method a webservice.

e.g.

global with sharing class myClass {


  webService static void myMethod(id anId){ // do something}
}

Then call your apex via:-

{!requireScript("/soap/ajax/30.0/connection.js")} 
{!requireScript("/soap/ajax/30.0/apex.js")} 

var retStr; 
retStr = sforce.apex.execute("myClass", "myMethod", {anId:'{!mySObject.Id}'}); 

More info here (https://www.salesforce.com/us/developer/docs/apexcode/Content/apex_and_ajax.htm)