¿Cómo eliminar un archivo de la cola para detener la carga antes de que comience la carga en blueimp Basic?
Aquí está la cosa,
Quiero un botón de cancelación similar a la interfaz de usuario básica más la interfaz de usuario jQuery enBASIC. Esta pregunta puede parecerte tonta. Pero en realidad me confundí con la plantilla que blueimp está usando en la interfaz de usuario básica más la interfaz de usuario jQuery para enumerar los archivos cargados y descargados con los botones de inicio, eliminación y cancelación.
EDITAR 1 aquí: Incluso no puedo usar esa plantilla porque estoy trabajando en una plantilla de ramita, que tiene una sintaxis similar que da error si la uso.
Necesito un código para eliminar el archivo de la cola y para evitar que se cargue antes de que comience la carga.
Busqué que _cancelHandler está en jquery.fileupload-ui.js pero hay muchas funciones que me están confundiendo.
Por favor alguien ayude.
Incluso leí el uso básico del complemento en la documentación (guía de configuración mínima) pero no hay datos para tener el botón de cancelación.
EDITAR 2 aquí: Creo que me faltó decir que solo necesito un botón de carga que cargará todos los archivos que están en cola. si algún archivo en la lista se cancela, entonces no debe cargarse.
aqui esta mi codigo
$(function () {
var cancel_btn = $('<button/>')
.addClass('btn btn-warning cancel pull-right')
.html('<i class="icon-ban-circle icon-white"></i><span> Cancel')
.on('click', function () {
var $this = $(this),
data = $this.data();
$(this).parents('tr').remove();
alert("code to remove from the queue and to prevent upload before upload start");
});
var delete_btn = $('<button/>')
.addClass('btn btn-danger cancel pull-right')
.html('<i class="icon-ban-circle icon-white"></i><span> Delete')
.on('click', function () {
alert('code needed to delete file');
});
$('#fileupload').fileupload({
dataType: 'json',
autoUpload: false,
add: function (e, data) {
console.log(data);
// data.context = $('<div/>').appendTo('#files');
$.each(data.files, function (index, file) {
var tr = document.createElement('tr');
var td1 = document.createElement('td');
var td2 = document.createElement('td');
var td3 = document.createElement('td');
$(td1).append(file.name);
$(td2).append(file.size);
$(td3).append(cancel_btn.clone(true).data(data));
$(tr).append(td1,td2,td3);
$('#files_list tbody').append(tr);
var size = $('#files_list tbody tr').size();
if(size < 1 )
$('#files_list').addClass('hide');
else
$('#files_list').removeClass('hide');
});
$('#submit').click(function (){
//data.context = $('<p/>').text('Uploading...').replaceAll($(this));
data.submit();
$('#files_list tbody').html('');
});
},
done: function (e, data) {
$.each(data.result.files, function (index, file) {
var tr = document.createElement('tr');
var td1 = document.createElement('td');
var td2 = document.createElement('td');
var td3 = document.createElement('td');
$(td1).append(file.name);
$(td2).append(file.size);
$(td3).append(delete_btn.clone(true).data(data));
$(tr).append(td1,td2,td3);
$('#files_list tbody').append(tr);
});
},
fail: function (e, data) {
//console.log(data.result);
$.each(data.result.files, function (index, file) {
var error = $('<span/>').text(file.error);
$(data.context.children()[index])
.append('<br>')
.append(error);
});
},
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$('#progress .bar').css(
'width',
progress + '%'
);
}
});
});