Talk:Tutorials:Creating a Loading Message






Talk:Tutorials:Creating a Loading Message

Note that this example works with v0.2.4, but fails for v0.5beta1

I developed another approach that works for v0.5beta1. It consists of submitting a form to trigger a java script. The example below shows how you can actually place a loading message anywhere and if needed even multiple ones. We start of with a simple form. 

<form id="LoginForm" action="javascript:void(null);" onsubmit="submitapplogin();">
    name: <input type="text" name="username"><br/>
    password: <input type="password" name="password"><br/>
    <div id="LoginDiv"><input id="LoginButton" type="submit" value="login"/>
  </form>

As you can see it will call a java function that we placed in the header and looks like: 

function submitapplogin()
  {
    strTest=xajax.getFormValues("LoginForm");
    xajax.$('LoginForm').innerHTML="<img src=\"images/ajax-loader.gif\" alt=\"loading....\"/>";
    xajax_pLoginForm(strTest);
    return false;
  };

The first thing we do in the script is saving the results to a container (strTest) because we would loose it when we change the content of our target, being the used form. Then we replace the form by a animated gif that gives the impression of something happening and we then go to the target function ploginform and handover (strTest) for processing.

You can repeat this with as many forms as you wish reporting to a diffrent java function to change different div's.

[edit] xajax 0.5 beta 2

In xajax 0.5 beta 2 there's again another way to accomplish this, see these forum topics:

Retrieved from "http://xajaxproject.org/wiki/Talk:Tutorials:Creating_a_Loading_Message"