Page 1 of 1

Ajax file uploads

Posted: Mon May 21, 2007 8:11 pm
by JellyFish
How do I upload a file with Ajax? I have a file-type-input field but how do I send it as a parameter?

Code: Select all

<input type="file" /> //this is what I call a "file-type-input" field :D
With things like text-type-input elements I can just go ahead an send it's value as a parameter for my Ajax request.

Like this:

Code: Select all

$.post("file.php", {text: $("$textField").val()})
But how would I send file-type-input field's file as a parameter? Does the value of the file-type-input field what I want to send as a parameter? I need PHP to recognize this parameter as the $_FILES super global, as regular form posts do.

Please help me with this one I'd so much appreciate it. :D

EDIT: I googled for "Ajax file uploads" and found out that the XMLHttpRequest object doesn't support file uploads.

So then how do I upload files without refreshing? Looking for a real straight-forward tutorial please. :D

Posted: Tue May 22, 2007 1:39 am
by Kieran Huggins
This has been asked quite a bit on the forum lately.. surprised you didn't see any of the other threads.

At any rate, you need to use a (hidden) iframe.

Posted: Tue May 22, 2007 2:54 am
by JellyFish
Yeah sorry. I should of googled first.

Thanks for you post.

Posted: Sat May 26, 2007 3:07 pm
by JellyFish
Is there a way to prevent an iframe from changing or adding to the back/forward history? Whenever the iframe loads a new page a new index is added to the history object.

Hopefully you know what I mean. So how do I prevent the iframe from adding more back history every time a page is loaded within it?

Posted: Sat May 26, 2007 3:24 pm
by feyd
Don't attempt to mangle the history. If you don't want it updated, use Ajax and DHTML to replace content.

Posted: Sat Jun 02, 2007 7:18 pm
by JellyFish
Feyd wrote:Don't attempt to mangle the history.
As soon as the iframe directs to a new page it adds to the history. I don't want this to happen.
Feyd wrote:If you don't want it updated, use Ajax and DHTML to replace content.
How could I uses Ajax to upload files? From what I've read it's not possible.

So unless you have a way to hack Ajax's abilities I'm going to have to mingle with the history, if that's possible.

Posted: Sun Jun 03, 2007 7:30 am
by feyd
JellyFish wrote:How could I uses Ajax to upload files? From what I've read it's not possible.

So unless you have a way to hack Ajax's abilities I'm going to have to mingle with the history, if that's possible.
There's been plenty of information on performing Ajax based uploads all over. Search.