I have some links that when the user clicks one, it links to a php script which runs some stored procedures to generate data and then calls another script to download the data as an excel spreadsheet. This all works fine.
What I'd like to do is have a loader gif appear beside the link that was clicked clicked and when the dialog appears to get the user to save the file, have that gif disappear again.
Can I track this event at all to achieve this? Not had much luck so far.
I would call the generate script as ajax, and use the success and error functions to recognize completion of the script? THen you can just start the animation, call your script, and when it returns you can cancel the animation.
Related
I am using FPDF to create a pdf document in an iFrame... During the pdf creation the script communicates and gets a lot of data from the server, and then I would like to display a progress bar.. That is why I have put the php generator in an iFrame.. then my plan was that the php script could send the looped data to the parent window..
e.g. every time a loop is made it says $count++;, then I know how many loops it has gone through, and I already know that it is going to limit the rows to the first 200 rows.. Then I would like to display the looped data in the parent widow like so: $count of §goal has been generated successfully!.. At the moment I am using jQuery, where I ask the php to echo some jQuery script every time a loop is made to display the results like so window.parent.count($count, $goal);.. Count in the parent winodw and it actually works well until the PDF has to be shown.. then I get an error message that tells me that the script is unable to display the PDF because the page already has outputted data..
Does anybody know how to make the PHP to send the data to the parent window, so I prevet the using of echo?
Sorry for my bad english.. if wished I can try to upload my script later for you to see...
I do it a bit differently...
I also wrote an application in which the PDF generator needs to fetch a rather large amount of data, so the generation takes a few seconds.
I use jQuery to fetch a php-page in the background. During this download, the screen turns gray and displays a classic "please wait"-circle. The only output that the php-file generates is an "OK" echo, together with a file link, when the generation has been completed. Instead of displaying the file inline, I save the PDF in a folder ($pdf->Output('filename.pdf','S')) and offer it as a download using the provided link and the jQuery-callback.
I hope you understand what I mean. Maybe this thought will help you a bit further.
EDIT: Don't know if this will work, but I just thought of it...
You could save the file and output the filename. Using jQuery, you could then refresh the contents of the iframe to fetch a page in which you display the already saved PDF inline...
I have a successfully working interface that I programmed using PHP GD Library where a user can enter multiple lines of text and when the user clicks "submit" it overlays the text they typed onto a png background.
Is it possible to do the same thing but use AJAX in the process? I'd like to somehow let each input field filled out automatically do an onblur, and trigger an AJAX script. That way they see the data entered into the fields change the image on the fly.
Normally when using AJAX, it sends a success callback to an input field, alert, or sets it into a DIV. Would I place the entire GD Library code into the PHP POST page and process it there, then somehow send the compiled PNG image to the AJAX success callback?
I'm just needing a general idea as to if it's possible, and the basic outline as to how I'd go about solving this. Thank you!
EDIT: Here is the last bit of code used to display the image after the text has been overlayed.
imagepng( $my_img, "./images/$form_token.png");
imagedestroy( $my_img );
Will this code end up on the PHP processing page that AJAX POSTS to? Or do I process the image with the GD Library functions and then somehow pass this image as an img src. Will I save it to my server, then display the img src that was saved as the AJAX success callback? I'm confused because I thought AJAX loaded things instantly without refreshing the page but will that still happen if saving the file to the server, then showing it in an image placeholder?
Yes you can.
You may use jQuery AJAX to do this.
Create a php file to respond to the Ajax data from the web page using jQuery, either by POST or GET method.
Make the php file return a success message on successful processing on data, and you may program something in your JavaScript to display success message.
You can read a tutorial here www.w3schools.com/jquery/jquery_ref_ajax.asp
Hope this helps..
I'm creating a website and I'd like to allow users to upload multiple files while they navigate the website.
When the upload completes, it would be nice to have a Javascipt event triggered, to allow the user to specify additional info related to the uploaded files (eg. photo location, tags, etc)
anyway, the required features are:
multiple files allowed for a single upload operation
display an optional progress indicator (at least in the "x of y files uploaded" fashion)
doing it without tying the users to a single page
How can I implement these features?
Any suggestion is greatly appreciated!
Edit
In the event of using a popup window to handle uploads, how can I:
inform the user (on the "master" page) that the upload has completed, or that there have been errors?
(more important) pass the $_FILES array to the popup window? I'd like the user to be able to click "upload" on the main window, or anyway to make the upload start from the main window (eg dragging and dropping files on the main window).
Since navigating the site will switch pages and it's unlikely that there's a full ajax navigation on your site, maybe it could help to somehow upload the files in a second popup window. Not sure how (if) it could be implemented, though, but since you need to upload multiple files at a time I'm afraid you're bound to use flash.
EDIT
So the solution could look like this:
When a user clicks a "select files" button you pop out a new window where he'll be able to actually select files (via flash if multifile upload is necessary). And to notify of upload progress use postMessage. Though postMessage isn't going to work in IE in this case, but probably you could somehow send the message to the server and from the server back to the page.
Another crazy idea is not to use a popup window, but let the user select the files on the page she was first, but once the user selects the files make all the links on the page target=_blank to make any subsequent navigation happen in another tab. I know it's hacky and not exactly user-friendly, but probably could help.
In any case I would inform the user beforehand that a new window will appear in both scenarios.
EDIT2
And an even crazier idea. When the user selects the files and clicks a link create an iframe which will cover the whole page and hide the original page beneath it and make the links open in the iframe. But it looks even more hackish and it seems you'll have much trouble with it.
I have a classifieds website, and when posting a new ad, users may chose to upload pictures.
Currently, the form on the page submits to itself whenever a file is chosen, and then PHP uploads the actual file, which is then lastly displayed to the user.
I use javascript to set some hidden-inputs on the page, and then submit the form to itself:
if (action!='remove'){
document.getElementById("pic_nr").value=nr;
document.getElementById("total_pics").value=nr;
document.getElementById("pic_action").value='upload';
var form = document.forms['ad'];
form.action='new_ad.php';
form.submit();
}
Then in PHP, it processes and uploads the image (which takes some time) and after its done the image is displayed in the same form.
Now I need to have a progress bar of some kind, which shows the user that the server is actually DOING something.
Because uploading a standard 2,5MB file from a digital-camera takes some time (around 10s), and usually the user doesn't understand that "something is happening" in the background.
Is there any standard reliable, cross-browser solution to add a loading bar with either JS or PHP, or even maybe both combined?
Any tips and ideas are appreciated.
Thanks
This site seems to have a pretty comprehensive list of tutorials with various approaches. JQuery to me would seem to be the best option to go with as it usually is pretty reliable between browsers and platforms.
you could POST the form using AJAX and on firing the form POST load a "loading" spinner on the page until you get a postback with a status from the server.
I'm adding a link to a sample HTML5 script that does it with drag-n-drop...
http://craigslist.fatherstorm.com/dragndrop.php
I have a search page.
On clicking search it will show a jquery modal with processing image and redirect to results page.
I have download functionality also in the search page. If I select the download option,
the result may vary to 1 kb to 25 MB, and I can't put a timer to close the modal window.
Is there any way to find the download is prompted?
Or download is completed? So that I can close modal at that time!!
Just make a popup that disappears when the user click anywhere else, like on github.
It would probably be too much job doing what you requests that it is not worth it. Better just showing a dialog that the user can dismiss whenever s/he wants to.
Well, yes it would be possible to have a script that runs while the file is being served (PHP normally times out within 30sec) and have periodically AJAX-requests to see if download is completed (or aborted).