#handle array of object has file on formData

1 messages · Page 1 of 1 (latest)

thorny lily
#

`const formData = new FormData();

Object.entries(values).forEach(([key, value]) => {
  if (Array.isArray(value)) {
    
  } else if (value instanceof Date) {
    formData.append(key, value.toString());
  } else {
    formData.append(key, value);
  }
});`

i have this code which is good but i dont know how to handle array on formData but i dont want to use JSON.stringify() because i have a file on that a array which not gonna working on that

cosmic bobcatBOT
#

Hi @thorny lily. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

Based on the information provided in the extracts, you can handle an array of objects that includes a file in FormData by iterating over the array and appending each item to the FormData instance. However, the extracts do not provide a specific example of handling an array that includes a file.

Here's a general approach:

Object.entries(values).forEach(([key, value]) => {
  if (Array.isArray(value)) {
    value.forEach((item, index) => {
      if (item instanceof File) {
        formData.append(`${key}[${index}]`, item, item.name);
      } else {
        formData.append(`${key}[${index}]`, item);
      }
    });
  } else if (value instanceof Date) {
    formData.append(key, value.toString());
  } else {
    formData.append(key, value);
  }
});

In this code, if the value is an array, we iterate over it. If an item in the array is an instance of File, we append it to FormData with its name. If it's not a File, we append it as a normal value.

Please note that this is a general approach and might need adjustments based on your specific use case. The extracts do not provide a specific solution for handling an array that includes a file in FormData.

For more information on handling FormData in Next.js, you can refer to the Next.js documentation (https://nextjs.org/docs/app/building-your-application/routing/route-handlers#examples-request-body-formdata).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@thorny lily kapa.ai is still learning and improving, please let us know how it did by reacting below

thorny lily
#

@cosmic bobcat good thanks, but i want to return data like this
{ body: string; title: string; checkIn: Date; checkOut: Date; guests: string; pricePerNight: string; galleryTour: { titleGallery?: string | undefined; imageGallery?: File | undefined; }[]; feauturedImage?: File | undefined; }

cosmic bobcatBOT
#

Let me check the knowledge base for you. One moment! :books:

#

Based on the structure you provided, you can handle the FormData as follows:

Object.entries(values).forEach(([key, value]) => {
  if (Array.isArray(value)) {
    value.forEach((item, index) => {
      if (typeof item === 'object' && item !== null) {
        Object.entries(item).forEach(([subKey, subValue]) => {
          if (subValue instanceof File) {
            formData.append(`${key}[${index}][${subKey}]`, subValue, subValue.name);
          } else {
            formData.append(`${key}[${index}][${subKey}]`, subValue);
          }
        });
      } else {
        formData.append(`${key}[${index}]`, item);
      }
    });
  } else if (value instanceof Date) {
    formData.append(key, value.toString());
  } else if (value instanceof File) {
    formData.append(key, value, value.name);
  } else {
    formData.append(key, value);
  }
});

In this code, if the value is an array, we iterate over it. If an item in the array is an object (which is the case for galleryTour), we iterate over the properties of the object. If a property value is an instance of File, we append it to FormData with its name. If it's not a File, we append it as a normal value. If the value is not an array but an instance of File (which is the case for feauturedImage), we append it to FormData with its name.

Please note that this is a general approach and might need adjustments based on your specific use case. The extracts do not provide a specific solution for handling an array that includes a file in FormData.