views:

7386

answers:

4

Hello all.

I am attempting to submit a form via jQuery. My form contains fields and a file that must be uploaded. It is of type ENCTYPE="multipart/form-data".

I can receive all my field values using: post = $('#myForm').serialize(); But how do I receive the $_FILES array? I need this to process the uploaded file.

Is this possible using jQuery, and if so how? Or do I need to use a special upload plugin for jQuery?

Thanks for any help!

+8  A: 

You cannot upload files through javascript.

Check out this related question:
http://stackoverflow.com/questions/543926/is-it-possible-to-ajax-a-file-upload/543927#543927

Essentially, the two most popular ways of "faking" AJAX for file uploads is using a Flash plugin such as SWFUpload or submitting the form to a hidden iframe that processes the request.

Paolo Bergantino
+6  A: 

jquery form is the best way to do it, you can add it to any normal form,

<form method="post" action="URL">
<input type="file" name="file">
<input type="text" name"text">
<input type="submit"> 
</form>

<script type="text/javascript">
$(document).ready(function() { 
  $(form).ajaxForm();
})
</script>

will work as expected, but with ajax.

http://malsup.com/jquery/form/#code-samples

Bruce Aldridge
A: 

If you can control the environment, like, say, you're writing an admin app for an intranet in which you recommend the browser, then real AJAX file uploads are possible with Firefox 3 and above. In all other cases, the iframe workaround or a Flash based uploader is the way to go.

Ionuț G. Stan
A: 

It's possible, but not working in Google Chrome ) Look!

...
<form method='post' enctype='multipart/form-data'>
<input type="file" id="imf" name="imf"/>
<input type="button" id="Save"/>
</form>

...

$("#Save").live("click", function(){

var photo = document.getElementById("imf"); 
var file  = photo.files[0];

   $.post('/user/saveNewPhoto', {'imf':file.getAsDataURL(), fname:file.fileName }, function( data ){
   alert ( data );
    });

});

upload side script need decode base64 ) and that is all but i don't test this script on big size file

TSpider