Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

185
Visualizações
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 à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda