html5 multiple upload along with ajax -
i trying use multiple upload attribute of html5 upload files. know wouldn't work ie , fall single file upload. found invalid html tag min max allows opera same.
i trying following: browse button capable of selecting multiple files. ajax should send files 1 one. scenario this: user selects 5 files , starts upload . ajax should firstfile send first file, second, , on. server side script file , returns data. 1 file upload completed must render part of result. user selects images , starts uploading results come out each file uploaded (and not after files uploaded).
i tried :
function handlefiles(files) { alert(files.length); //properly returns number of files selected (var = 0; < files.length; i++) { new fileupload(files[i]) } } function fileupload(file) { var reader = new filereader(); var xhr = new xmlhttprequest(); this.xhr = xhr; xhr.open("post", "portfolio/add_media"); reader.onload = function(evt) { xhr.sendasbinary(evt.target.result); }; reader.readasbinarystring(file); }
after reading tutorial @ mozilla end missing params.
. can 1 suggest me clean solution this
some more details : when pass single file ( no multiple attribute ) server recieves :
"image"=>[# < actiondispatch::http::uploadedfile:0x10d55be8 @tempfile=#< file:c:/users/gaurav/appdata/local/temp/rackmultipart20110701-1916-2ly4k2-0>, @headers="content-disposition: form-data; name=\"picture[image][]\"; filename=\"desert.jpg\"\r\ncontent-type: image/jpeg\r\n", @content_type="image/jpeg", @original_filename="desert.jpg">]}}
but when use multiple attribute , send using xhr able 1 file param. how rest of params ? esp action dispatch thingy
you sending file data server, without encoding in way. server know how process need encode data (multipart/form-data
encoding). easiest way using formdata
object: https://developer.mozilla.org/en/using_xmlhttprequest#sending_files_using_a_formdata_object. instead of data.append("customfield", "this data")
write data.append("file1", event.target.result)
.
Comments
Post a Comment