Update: there are better solutions, it is actually possible to upload a filewithout refreshing the page.
Sometimes you want to upload a file, for instance a picture. At present, it’s not possible to do this with an XMLHttpRequest (aka Ajax).
If you’re not fussed about Ajax, you can just submit your form normally (obviously). Nobody has ever died from a page refresh.
If you really don’t want to leave your current page, but would like to reproduce the modal window effect, you can use (gasp) pop-ups. Pop-ups have gotten a bad reputation, because some uncouth websites swamp your desktop with ugly pop-up ads.
Nifty jQuery plugins to the rescue (again): PopupWindow. It basically opens a window with target to _blank and the style (in the “rel” attribute) set to given parameters, when you click the selected element.
An example: say you want to open a pop-up window on a link with class “picture”:
1 2 3 4 5 6 7 8 9 10 11 12
The link destination is used for the pop-up window – this should GET a file upload form.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
What this does: if there’s an error, it displays it before the “header” section (replace by appropriate position). Else it loads the image into the div with id “image” in the original page (window.opener) and then closes the actual pop-up window.