From 511a6a2a2e7f7c85a679418737ba8f58270b0703 Mon Sep 17 00:00:00 2001
From: Adam Nielsen <1765602+iwasherefirst2@users.noreply.github.com>
Date: Thu, 29 Oct 2020 13:35:19 +0100
Subject: [PATCH] Support file and array uploads

To support file and array uploads
one has to send a FormData object
instead of a plain JS object.

I created a video at https://www.youtube.com/watch?v=kEy7w3KAtlc&t=445s
how FormData works.

Fixes: #25, #19
---
 public/js/app.js | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/public/js/app.js b/public/js/app.js
index 11b72d6..1122366 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -85,10 +85,24 @@ class Form {
      * Fetch all relevant data for the form.
      */
     data() {
-        let data = {};
+
+        let data = new FormData();
 
         for (let property in this.originalData) {
-            data[property] = this[property];
+
+            if (Array.isArray(this[property])) {
+                var tmp_array = this[property];
+                for (var i = 0; i < tmp_array.length; i++) {
+                    // use append instead of set, otherwise
+                    // field[] would be overwritten
+                    // https://developer.mozilla.org/en-US/docs/Web/API/FormData/append
+                    data.append(property + '[]', tmp_array[i]);
+                }
+                continue;
+            }
+
+            // https://developer.mozilla.org/en-US/docs/Web/API/FormData/set
+            data.set(property, this[property]);
         }
 
         return data;