progress indicator on page.

[xren]

Hi,

I would like to add a progress indicator on a page. e.g. on a search page, click a button to search from DB, then display the result.

It may take a long time for the search to finish. I would like to show a progress indicator to let user know the action is in place, the result will show up soon.

How can this be done?

Thanks,
Xiaoli

[Steve]

Hi Xiaoli,

You should set the cursor to progress when you click the button.

Code: Select all

$("*").css("cursor", "progress");

Just remember to return it afterwards:

Code: Select all

$("*").css("cursor", "auto");

Steve

[xren]

Thank you Steve. This is exactly what I need.

[geadon]

Hi,

Would you be able to advise me where I could put the code to return the cursor back to "auto"? I have a search button which when clicked fetches a database resource. Once the resource has been retrieved, the cursor should return to default but I'm not sure where to place the code.

Any advise would be much appreciated.

[Steve]

Hi geadon,

If you have Ajax switched off on your form (Form Properties), then the cursor will automatically change for you.

If you have Ajax switched on, then you should be able to change the cursor back after the task you are doing is completed.

e.g

Code: Select all

function doSomething()
{
  try
  {
     $("*").css("cursor", "progress"); //set cursor
     //execute some code here and do something
  }
  finally
  {
     $("*").css("cursor", "auto"); //finish
  }
}

Kind regards

Steve

[geadon]

Thank you for your advice.