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

184
Vistas
Uploaded files submitted empty in react

I've got a file typed input to attach files in a form. This question was asked before that uploaded files were submitted empty and the answer is to wrap the files in a formData.

The difference in my codes is that these files are not submitted solely, but as a part of a nested object through a PUT request (actions are handled in a reducer)

export default function checklistVersionReducer(configObj, action) {
    switch (action.type) {
        case "initiate": {
            const { payload } = action;
            const idAssignedConfig = assignSectionId(payload.config);
            return { ...payload, config: idAssignedConfig };
        }
        case "update": {
            const { value, secId, subsecId, item } = action;
            let configCopy = Object.assign({}, configObj);
            configCopy.config[secId].subSections[subsecId][item] = value;
            return configCopy;
        }
        /////////////// - Action to handle the attached files - /////////////// 
        case "attach": {
            const { files, secId, subsecId } = action;
            const filesData = new FormData();
            for (let i = 0; i < files.length; i++) {
                filesData.append("file", files[i]);
            }
            let configCopy = Object.assign({}, configObj);
            configCopy.config[secId].subSections[subsecId].docs = [filesData];
            return configCopy;
        }
        /////////////// -/ Action to handle the attached files - /////////////// 
        case "changeStatus": {
            const { status } = action;
            return { ...configObj, documentStatus: status };
        }
        case "updateOperator": {
            const { newOpId } = action;
            return { ...configObj, operatorId: newOpId };
        }
        case "updateSecondOperator": {
            const { newOpId } = action;
            return { ...configObj, operatorId2: newOpId };
        }

        default:
            console.error("Unhandled action type " + action.type);
            break;
    }
}

The problem is it still submits empty formData and I'm not sure where the problem is.

Any help is appreciated.

about 4 years ago · Juan Pablo Isaza
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