ADF Ajax ,How to show loading/busy status, Here is my solution.

Question

1- Set an "id" for property of form.
2- Set Partial Triggers to "your form id" for property of command button.
3- Set Partial Submit to "True" for property of command button.
4- Add client listener to your command button.
5- Add your javascript to your page.
<div id="loader"></div>
<af:commandButton actionListener="#bindings.collectDataUsingStoredProcedure.execute}"
text="Kaydet"
disabled="#{!bindings.collectDataUsingStoredProcedure.enabled}"
id="cmdkaydet" partialTriggers="myform"
partialSubmit="true">
<af:clientListener method="Ajax" type="action"/>
</af:commandButton>
and my javascript here;
function Ajax(action){
document.getElementById("loader").innerHTML = "<img src='./busy.gif'></img>";
req = new XMLHttpRequest();
retrieveURL("#");
function retrieveURL(url) {
if (window.XMLHttpRequest) { // Non-IE browsers
req = new XMLHttpRequest();
req.onreadystatechange = processStateChange;
try {
req.open("GET", url, true);
} catch (e) {
alert(e);
req.send(null);
} else if (window.ActiveXObject) { // IE
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange = processStateChange;
req.open("GET", url, true);
req.send();
function unloadimg(){
document.getElementById("loader").innerHTML = "";
function processStateChange() {
if (req.readyState == 4) { // Complete
if (req.status == 200) { // OK response
//document.getElementById("loader").innerHTML = req.responseText;
setTimeout ("unloadimg();",500);
return;
} else {
alert("Problem: " + req.statusText);
Mucahid Uslu
Message was edited by:
Mücahid Uslu
null

Answer 1

Hi,
couples of issues here
1. You should mention that this solution works with JDveloper 11, not 10.1.3 as people would suspect on this forum
2. ADF Faces RC is only supported for IE7 and FF 2.0 (and upwards later on). This means that there no longer is a need to differentiate between the browers to issue a XmHttprequest
A more straight forward solution would be
- Execute the ADF binding from a method action and set the command button to blocking
- From your JavaScript, display a image that shows an animated busy icon
- From the managed bean that contains the method action, call the ExtendedRenderService to call another script on the page to hide the busy image
You can also use some HTML text instead of the image to indicate the "busy"
Frank