How to show a progress bar when a user attempts to download a file

I have a site that downloads a pdf when the user clicks a button. Only thing is that it takes about 15 seconds to produce that pdf server side, so in the mean time the user is wondering why it is so slow. How can I display a progress bar that will show while the server is spool the pdf and then go away when the download has started (or stopped, whatever).

** edited **

I'm using jquery and so far what I did is on click i added a class and applied a background image. The background image is an animated gif and shows up. I was hoping that after you click to downloa开发者_JS百科d the pdf it would redirect the browser to the pdf and then back to the page after it starts downloading, there by refreshing the page and removing the background image. No dice on this one :(

I will try the uniqid approach as described below.

Ideas??

You could just add a spinner (to show the user that something is happening), and then write that it takes about 15 sec to create the PDF. That should be enough for most users.

Your server-side code should give each PDF a unique ID. When the user clicks to download a PDF, the unique ID is retrieved by AJAX. The AJAX can then access a server-side page (progress.php?pdf-id=4) which will return the progress. jQuery UI has a progress bar which is already set up, so you don't need to create it yourself.