I'm using blueimp
file upload plugin but I don't for multiple files
but I don't know how to send custom attributes. I wanted to send all these custom attribute to server with each chunk
no problem(how we send formData
). How we send for formData
similarly, can I send attribute?
var formdata = new formData();
formdata.append('filename',currentFile[i]);
formdata.append('filesize',currentFile[i].size);
Note: I wanted to send the data in chunks
Here is a code what I'm trying jsfiddle(in firefox opens perfectly): http://jsfiddle.net/davidchase03/ChJ9B/
HTML
<input id="fileupload" type="file" name="files[]" multiple>
<div class="progress">
<div class="meter" style="width: 0%;"></div>
</div>
<div class="data"></div>
JavaScript
$(function () {
$('#fileupload').fileupload({
url: '/echo/json/',
maxChunkSize: 1048576,
maxRetries: 3,
dataType: 'json',
multipart: false,
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10),
meter = $('.progress .meter'),
percent = progress + '%';
meter.css('width', percent).text(percent);
},
add: function (e, data) {
data.context = $('<p/>').text('Uploading...').appendTo('.data');
data.submit();
},
done: function (e, data) {
data.context.text('Upload finished.');
},
fail: function (e, data) {
data.context.text('Upload failed.');
$('.progress').addClass('alert');
console.warn('Error: ', data);
}
}).on('fileuploadchunksend', function (e, data) {
// if (data.uploadedBytes === 3145728 ) return false;
}).on('fileuploadchunkdone', function (e, data) {
});
});
Question: to make you clear this is what I wanted How to send custom data to server using jquery-file-uploader
Please help me thanks in advance!!!
You can send additional custom attribute using headers options. Example:
$(function () {
$('#fileupload').fileupload({
url: '/echo/json/',
...
headers : {
customAttribute: 'customValue'
}
});
For Dynamic values, you can use beforeSend callback as explained in the following example
$(function () {
$('#fileupload').fileupload({
url: '/echo/json/',
...
beforeSend : function(xhr) {
xhr.setRequestHeader("customAttribute", someCalculateValueFunction('customValue'));
}
});