First, include jQuery in your page:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

Here is the API 2 of cPanel:
http://docs.cpanel.net/twiki/bin/view/ApiDocs/Api2/WebHome

Find the modules and function names you need, and use them when calling the function below.

Copy the following function to your webpage:

function cpanel_call(module, fct, domain, user, password, secure, port, json, callback, return_as, async)
{
var protocol = secure ? "https" : "http";
var data_type = json ? 'json-api' : 'xml-api';

var authStr = "Basic " + Base64.encode(user + ":" + password);
var url = protocol + "://" + domain + ":" + port + "/" + data_type + "/cpanel?user=" + user + "&cpanel_xmlapi_module=" + module + "&cpanel_xmlapi_func=" + fct + "&cpanel_xmlapi_version=2&domain=" + domain;

jQuery.ajax({
"type" : "GET",
"username" : user,
"password" : password,
"url" : url,
"async" : false,
"dataType" : return_as ? return_as : "text",
headers : {"Authorization" : authStr},
beforeSend : function(xhr)
{
xhr.setRequestHeader("Authorization", authStr);
},
success : function(msg, textStatus, xhr){

if (callback)
callback.apply(this, [msg]);

},
error : function(){
alert("Connection Error!");
}
});
}

Use the function like this:


cpanel_call(cpanel_module_name, cpanel_fct_name, domain, cp_user, cp_password, port, json, function(msg){
//do whatever you want, when it finished
}, return_as, async);

The answer from the server will be found in the msg variable received by the callback function. You will receive it in the format specified by return_as parameter. See the parameter explanation below.

Parameter explanation:
cpanel_module_name – the cPanel module you would like to call from API2
cpanel_fct_name – a cPanel function from the module above
domain – the domain of your host
cp_user – cPanel username
cp_password – cPanel password
port – cPanel port, usually 2082 for unsecure and 2083 for secure
json – specifies the format of the received data, set “json” for json, set “xml” or leave it empty for xml
function(){ – a callback function, this is executed after the cpanel request has been executed
return_as – the format format for returning data, set “text” or leave it empty to return as text, “json” for a JSON object, “xml” for an xml object
async – the call should be synchronous or asynchronous? Set false for synchronous and true for asynchronous

Example, list all Addon Domains from cPanel:

cpanel_call("AddonDomain", "listaddondomains", "my_domain.com", "my_user", "my_pass", 2082, "xml", function(msg){
alert("msg"); //this is what the server returned
}, "text", false);

One last thing! My function uses a BASE64 encode class, from: webtoolkit.info! Copy the function from below or from their website: http://www.webtoolkit.info/javascript-base64.html. Make sure your page contains this function, otherwise my function won’t work.


/**
*
*  Base64 encode / decode
*  http://www.webtoolkit.info/
*  Class Needed for authentication
*
**/

var Base64 = {

// private property
_keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",

// public method for encoding
encode : function (input) {
var output = "";
var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
var i = 0;

input = Base64._utf8_encode(input);

while (i < input.length) {

chr1 = input.charCodeAt(i++);
chr2 = input.charCodeAt(i++);
chr3 = input.charCodeAt(i++);

enc1 = chr1 >> 2;
enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
enc4 = chr3 & 63;

if (isNaN(chr2)) {
enc3 = enc4 = 64;
} else if (isNaN(chr3)) {
enc4 = 64;
}

output = output +
this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);

}

return output;
},

// public method for decoding
decode : function (input) {
var output = "";
var chr1, chr2, chr3;
var enc1, enc2, enc3, enc4;
var i = 0;

input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");

while (i < input.length) {

enc1 = this._keyStr.indexOf(input.charAt(i++));
enc2 = this._keyStr.indexOf(input.charAt(i++));
enc3 = this._keyStr.indexOf(input.charAt(i++));
enc4 = this._keyStr.indexOf(input.charAt(i++));

chr1 = (enc1 << 2) | (enc2 >> 4);
chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
chr3 = ((enc3 & 3) << 6) | enc4;

output = output + String.fromCharCode(chr1);

if (enc3 != 64) {
output = output + String.fromCharCode(chr2);
}
if (enc4 != 64) {
output = output + String.fromCharCode(chr3);
}

}

output = Base64._utf8_decode(output);

return output;

},

// private method for UTF-8 encoding
_utf8_encode : function (string) {
string = string.replace(/\r\n/g,"\n");
var utftext = "";

for (var n = 0; n < string.length; n++) {

var c = string.charCodeAt(n);

if (c < 128) {
utftext += String.fromCharCode(c);
}
else if((c > 127) & (c < 2048)) {
utftext += String.fromCharCode((c >> 6) | 192);
utftext += String.fromCharCode((c & 63) | 128);
}
else {
utftext += String.fromCharCode((c >> 12) | 224);
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
utftext += String.fromCharCode((c & 63) | 128);
}

}

return utftext;
},

// private method for UTF-8 decoding
_utf8_decode : function (utftext) {
var string = "";
var i = 0;
var c = c1 = c2 = 0;

while ( i < utftext.length ) {

c = utftext.charCodeAt(i);

if (c < 128) {
string += String.fromCharCode(c);
i++;
}
else if((c > 191) & (c < 224)) {
c2 = utftext.charCodeAt(i+1);
string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
i += 2;
}
else {
c2 = utftext.charCodeAt(i+1);
c3 = utftext.charCodeAt(i+2);
string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
i += 3;
}

}

return string;
}

}

If you set up everything correctly the alert above should show the xml that cPanel API returned. If you find something that is hard to understand please post it below in the comment box and I will try to answer as soon as possible!