ITUTORIAL GROUP

Tahukah Anda ternyata Ajax sangat mudah digunakan untuk mendukung bahasa pemograman web. dibawah ini merupakan contoh AJAX yang sangat mudah digunakan. tinggal copy dan paste sesuai keinginan anda. sebelum menggunakan pastikan anda sudah ada dasar tentang menggunakan Ajax.

Simple Request
AjaxRequest.get(
{
'onSuccess':function(req){ document.forms['simple'].pageSource.value = req.responseText; }
}
);

Error Handling
AjaxRequest.get(
{
'url':'junk.html'
,'onSuccess':function(req){ alert('Success!'); }
,'onError':function(req){ alert('Error!\nStatusText='+req.statusText+'\nContents='+req.responseText);}
}
);

Timeout
AjaxRequest.get(
{
'url':'sleep.pl'
,'onSuccess':function(){ alert('Success!'); }
,'timeout':2000
,'onTimeout':function(req){ alert('Timed Out!'); }
}
);

Simultaneous Requests
function getResponse(target) {
AjaxRequest.get(
{
'url':'sleep.pl'
,'onSuccess':function(req){ target.value=req.responseText; }
}
);
}

Activity Monitoring
// Simple functions to update the page
function makeActive(o) { o.innerHTML = "Active"; o.style.backgroundColor = "#00ff00"; }
function makeInactive(o) { o.innerHTML = "Inactive"; o.style.backgroundColor = "#ff0000"; }

// Functions called by global begin/end
function AjaxRequestBegin() { makeActive(document.getElementById('ajaxActivity')); }
function AjaxRequestEnd() { makeInactive(document.getElementById('ajaxActivity')); }

// Functions called by group begin/end
function AjaxRequestGroupBegin(groupName) { makeActive(document.getElementById(groupName+"Activity")); }
function AjaxRequestGroupEnd(groupName) { makeInactive(document.getElementById(groupName+"Activity")); }

function getResponse2(target,groupName) {
AjaxRequest.get(
{
'url':'sleep.pl'
,'onSuccess':function(req){ target.value=req.responseText; }
,'groupName':groupName // Assigns this request to the group passed in
,'onGroupBegin':AjaxRequestGroupBegin // Map to the function called when this group starts
,'onGroupEnd':AjaxRequestGroupEnd // Map to the function called when this group ends
}
);
}

Form Submittal
function submitForm(theform) {
var status = AjaxRequest.submit(
theform
,{
'onSuccess':function(req){ document.forms['form2'].submitResults.value = req.responseText; }
}
);
return status;
}

Event Handlers
AjaxRequest.get(
{
'onLoading':function() { alert("Loading"); }
,'onLoaded':function() { alert("Loaded"); }
,'onInteractive':function() { alert("Interactive"); }
,'onComplete':function() { alert("Complete"); }
,'onSuccess':function() { alert("Success"); }
}
);

Queued Requests
function getQueuedResponse(target) {
AjaxRequest.get(
{
'url':'sleeplong.pl'
,'onLoading':function(req){ target.value=req.xmlHttpRequest.readyState; }
,'onLoaded':function(req){ target.value=req.xmlHttpRequest.readyState; }
,'onInteractive':function(req){ target.value=req.xmlHttpRequest.readyState; }
,'onSuccess':function(req){ target.value=req.xmlHttpRequest.readyState; }
}
);
}

Request Parameters
AjaxRequest.get(
{
'parameters':{ 'a':'1', 'b':'2', 'c':'3' }
,'anotherParameter':'true'
,'onSuccess':function(req) { document.forms["parameterForm"].exampleUrl.value = req.url; }
}
);

Informasi Lengkap nya dan contoh menjalankannya
disini