Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

218
Vistas
¿Es posible eliminar solo algunos de los archivos de una selección de entrada de archivos múltiples del usuario usando js antes de enviar el formulario al servidor?

Estoy tratando de filtrar algunos de los archivos seleccionados por el usuario en un elemento de entrada de archivos múltiples en mi formulario html5 antes del envío. Parece que puede eliminar TODOS los archivos seleccionados por el usuario de cualquier entrada de archivo en el formulario o ninguno de los archivos seleccionados por el usuario de una entrada de archivo antes de enviar el formulario y cargarlo en el servidor. Sería bueno poder eliminar cualquier archivo ofensivo antes de cargarlo. De lo contrario, debe permitir que los archivos se carguen y hacer que php se ocupe de los archivos cargados después del envío. Gracias por cualquier idea.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Parece que mis sospechas se confirmaron y la única forma de agregar archivos a una entrada de archivo es establecerlo igual a un objeto de transferencia de datos, es decir:

fileInput.files=evt.dataTransfer.files;

evt.dataTransfer.files representa los archivos que el usuario seleccionó/eliminó y no se pueden cambiar a través del código js en la página.

No pude agregar archivos a una entrada de archivo usando formData.append() para agregar archivos individuales en múltiples iteraciones aditivas a una entrada de archivo.

Esta solución a continuación está funcionando. El proceso consiste en instanciar su propio objeto DataTransfer al cargar la página. Luego obtenga los archivos cargados por el usuario de evt.dataTransfer.files en cada arrastre o navegue e itere a través de ellos. Cuando encuentre archivos que cumplan con sus criterios, agréguelos a su propio objeto DataTransfer personalizado. Una vez que su propio objeto de transferencia de datos esté configurado con los archivos que desea agregar después de que cada usuario los suelte, actualice fileInput.files= su propio objeto de transferencia de datos.

cargar:

var dT=new dataTransfer(); var fileInput=document.forms[0].elements['files[]'];

// ahora en cada gota obtendrá los archivos seleccionados por el usuario como: evt.dataTransfer.files para que siempre comience con eso.

 function dropHandler(evt) { //prevent default action evt.preventDefault(); evt.stopPropagation(); //for each file in the user selection, validate them as you wish //and only add the ones you want to the dataTransfer object you already created. for (const file of evt.dataTransfer.files) { //if this validate that etc //if file is good to add dT.items.add(file); } //at the end of each drop //once you have added only the files you want to your own dT object //update your form's file input's files to the latest version of your dT object's files fileInput.files=dT.files; }//end drop handler function`

Ahora tiene la entrada de archivo de su formulario rellenada solo con los archivos seleccionados por el usuario que desea, ha eliminado el resto y está listo para enviar el formulario.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda