En mi aplicación Spring MVC, implementé un Dropzone usando la biblioteca dropzone.js . Esto funciona muy bien y mi configuración de JavaScript se pega a continuación.

 Dropzone.options.frmTarget = { autoProcessQueue: false, paramName: 'file', clickable: true, maxFilesize: 20, uploadMultiple: false, parallelUploads: 10, maxFiles: 20, addRemoveLinks: true, acceptedFiles: '.png,.jpg,.pdf,.doc,.docx,.xls, .xlsx,.xml,.bmp,.msg,.txt', dictDefaultMessage: 'Drag files or click here to select', init: function () { var myDropzone = this; myDropzone.removeAllFiles(); // Update selector to match your button $("#button").click(function (e) { e.preventDefault(); myDropzone.processQueue(); }); $("#button1").click(function (e) { e.preventDefault(); myDropzone.removeAllFiles(); }); } }

Hay una pequeña parte del comportamiento que me gustaría cambiar si es posible. Configuré autoProcessQueue en falso, lo que significa que los archivos no se cargan tan pronto como se colocan en Dropzone . En cambio, toda la cola se procesa cuando el usuario hace clic en un botón.

También configuré addRemoveLinks en verdadero. Esto significa que cuando agrego mis archivos a Dropzone, tengo la opción de eliminarlos individualmente antes de procesar la cola haciendo clic en el enlace "Eliminar archivo" que aparece debajo del icono de cada archivo. Cuando se procesa la cola, el texto del enlace cambia a "Cancelar carga" y vuelve a cambiar a "Eliminar archivo" después de cargar el archivo. Esto se puede ver en la imagen a continuación, que muestra mi Dropzone después de un evento de carga.

Si bien es realmente útil tener el enlace "Eliminar archivo" antes de procesar la cola y el enlace "Cancelar carga" durante la carga, me gustaría no mostrar el enlace "Eliminar archivo" después de la carga. Idealmente, no habría nada en absoluto, o texto (no un enlace) que diga "Archivo procesado". Estaría muy agradecido por cualquier consejo sobre la mejor manera de hacer esto, muchas gracias por leer.