Я нашел решения о том, как добавлять дополнительные данные формы при отправке формы загрузки файла. Этот вопрос заключается в том, как загрузить дополнительные данные, если нет файла для загрузки.
Я использую blueimp jquery-file-upload в приложении для управления задачами, чтобы перетащить файлы и прикрепить их к задаче.
script инициализируется и настраивается, чтобы автоматически не загружать файлы при подключении файлов. В обратном вызове fileuploadadd
я прикрепляю data.submit()
к моему обработчику событий submit
. Это позволяет отправить данные задачи и файлы в один запрос POST.
Пока файлы не будут добавлены, я не могу получить доступ к файлу-upload data
, чтобы использовать функцию data.submit()
. Я приступил к работе, добавив пустой файл (а затем удалив его) при загрузке страницы, который вызовет привязку data.submit()
к кнопке отправки. Проблема в том, что плагин возвращает ошибку при попытке пропустить пустой массив файлов. Эта проблема также возникнет, если вы добавите файл, а затем удалите его перед отправкой формы.
Я искал какое-то решение для этого и выглядел высоко и низко, но ничего не смог найти в (IMHO) ужасной документации.
Посмотрите мой код ниже:
$('#post_task').fileupload({
autoUpload: false,
singleFileUploads: false,
disableImagePreview: true,
}).on('fileuploadadd', function (e, data) {
$.each(data.files, function (index, file) {
var filename = file.name,
filesize = bytesToSize(file.size)
ext = filename.substr(filename.lastIndexOf('.')+1,5),
icon = '<i class="sprite_file sprite_file-file_extension_'+ext+'"></i>',
node = $('<li/>').append($('<span/>').html(icon + filename + ' ' + filesize + '<a href="#">×</a>')).attr('data-index',index);
node.find('a').click(function(e){
e.preventDefault();
var $self = $(this),
$listItem = $self.parents('li'),
listIndex = $listItem.attr('data-index');
$listItem.remove();
$('#files li').attr('data-index',function(index){return index;});
data.files.splice(listIndex,listIndex);
console.log(data);
vardata = data;
});
$('#files').append(node);
});
$('#post_task').unbind('submit').submit(function(ev){
ev.preventDefault();
data.submit();
});
});