How to show loading message for AJAX applications?

Lets say you have a new user registration page where you validate user entered loginid against the database using Ajax and immediately display available or not.

for this you might do like..

1. Detect onChange event of the text field
2. read input and call Ajax
3. process ajax output and display availability in the adjacent div or span tag using innerHTML.

Sometimes it may take a while for ajax to complete the process of calling the remote database and read back responseXML, now if you want to show a loading or processing screen for that moment ?, just use this tip.

While onChange event of the text field occurs…

function loginID_OnChange(){
  //set the div tag to show loading message
   document.getElementById(“opmsg”).innerHTML = ”    checking availability…”;
   // call the ajax for checking the loginid
   var result = myAjaxFunction(loginidvalue);
   // show the new value in the div tag
   document.getElementById(“opmsg”).innerHTML = result;
}

LoginID: