Connect uploaded file with related model with Strapi

Question

I am using Strapi, Sqlite3 and React. I want to send a form with a file attached.

I have a Job model, which looks like this:

{
  "connection": "default",
  "collectionName": "jobs",
  "info": {
    "name": "job",
    "description": ""
  },
  "options": {
    "increments": true,
    "timestamps": true,
    "comment": ""
  },
  "attributes": {
    "firstName": {
      "type": "string"
    },
    "lastName": {
      "type": "string"
    },
    "email": {
      "type": "string"
    },
    "resume": {
      "model": "file",
      "via": "related",
      "plugin": "upload"
    },
    "jobcategory": {
      "model": "jobcategory",
      "via": "jobs"
    }
  }
}

I am sending text input with submitCareer method, and uploadFile for uploading:

export async function submitCareer(url, formValues) {
    try {
        const entries = await rootUrl.createEntry(url, formValues);
        return entries;
    } catch (err) {
        console.log(err);
    }
}

export async function uploadFile(formValues) {
    try {
        const upload = await rootUrl.upload(formValues);
        return upload;
    } catch (err) {
        console.log(err);
    }
}

This is the usage in my Career component:

const handleSubmit = (event) => {
        const formData = new FormData();
        formData.append("files", fileInput.current.files[0]);   

        submitCareer('jobs', values);

        uploadFile(formData);


        setValues({
            firstName: '',
            lastName: '',
            email: '',
            resume: null
        })

        event.preventDefault();
    }

I get this response:

{
        "id": 66,
        "firstName": "John",
        "lastName": "Doe",
        "email": "john@gmail.com",
        "jobcategory": null,
        "lname": null,
        "created_at": 1561988031279,
        "updated_at": 1561988031279,
        "resume": {}
    }

So, how can i connect resume with Job model?

Answer 1

Linking model to a file

You must create process with to two steps:

1. Create File -> POST /upload.
2. Create Jobs with id from FileResponse -> POST /jobs.

Example:

    const handleSubmit = (event) => {
      const formData = new FormData();
      formData.append("files", fileInput.current.files[0]);
      resumeUploadFile = await uploadFile(formData);

      const jobsInput = {...jobs, ...{resume: resumeUploadFile.id}}
      await submitCareer('jobs', jobsInput);

      setValues({
        firstName: '',
        lastName: '',
        email: '',
        resume: null
      })

      event.preventDefault();
    }

https://strapi.io/documentation/3.0.0-beta.x/guides/upload.html#file-upload

Linking files to an entry

You can linking too file to an entry wich is created, then you create first Jobs and then link upload ResumeFile with added new fields like refId from Jobs (Jobs -> id), ref in your case jobs and field=resume

https://strapi.io/documentation/3.0.0-beta.x/guides/upload.html#examples