Insert data handler for an ajax form

diff --git a/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts b/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts
index 55811033499acdd62a2c18e7b24e38f1ef31d26a..ba6c4d2af9b9e5e46f1c526fe16c6a3fb4f51ff7 100644 (file)
--- a/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts
+++ b/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts
@@ -11,6 +11,8 @@ import { deleteFile } from "WoltLabSuite/Core/Api/Files/DeleteFile";
 import { formatFilesize } from "WoltLabSuite/Core/FileUtil";
 import DomChangeListener from "WoltLabSuite/Core/Dom/Change/Listener";
 
+const _data = new Map<string, FileProcessor>();
+
 export interface ExtraButton {
   title: string;
   icon?: string;
@@ -52,6 +54,8 @@ export class FileProcessor {
     this.#container.querySelectorAll<WoltlabCoreFileElement>("woltlab-core-file").forEach((element) => {
       this.#registerFile(element, element.parentElement);
     });
+
+    _data.set(fieldId, this);
   }
 
   get classPrefix(): string {
@@ -349,4 +353,21 @@ export class FileProcessor {
 
     this.addButtons(container, element);
   }
+
+  get values(): Set<number> {
+    return new Set(
+      Array.from(this.#container.querySelectorAll<HTMLInputElement>('input[type="hidden"]')).map((input) =>
+        parseInt(input.value, 10),
+      ),
+    );
+  }
+}
+
+export function getValues(fieldId: string): Set<number> {
+  const field = _data.get(fieldId);
+  if (field === undefined) {
+    throw new Error("Unknown field with id '" + fieldId + "'");
+  }
+
+  return field.values;
 }

diff --git a/ts/WoltLabSuite/Core/Form/Builder/Field/FileProcessor.ts b/ts/WoltLabSuite/Core/Form/Builder/Field/FileProcessor.ts
new file mode 100644 (file)
index 0000000..5dc1da7
--- /dev/null
+++ b/ts/WoltLabSuite/Core/Form/Builder/Field/FileProcessor.ts
@@ -0,0 +1,24 @@
+/**
+ * Data handler for a file processor form builder field in an Ajax form.
+ *
+ * @author      Olaf Braun
+ * @copyright   2001-2024 WoltLab GmbH
+ * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @since       6.1
+ */
+
+import Field from "WoltLabSuite/Core/Form/Builder/Field/Field";
+import { FormBuilderData } from "WoltLabSuite/Core/Form/Builder/Data";
+import { getValues } from "WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor";
+
+export default class FileProcessor extends Field {
+  protected _getData(): FormBuilderData {
+    return {
+      [this._fieldId]: getValues(this._fieldId),
+    };
+  }
+
+  protected _readField(): void {
+    // does nothing
+  }
+}

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js
index 47edaa86aa4b18198fcc8ce9265d782249afc1cc..38ab23cd938115c5050dc7033ca29f2b18c497fc 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js
@@ -7,8 +7,9 @@
 define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSuite/Core/Api/Files/DeleteFile", "WoltLabSuite/Core/FileUtil", "WoltLabSuite/Core/Dom/Change/Listener"], function (require, exports, tslib_1, Language_1, DeleteFile_1, FileUtil_1, Listener_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.FileProcessor = void 0;
+    exports.getValues = exports.FileProcessor = void 0;
     Listener_1 = tslib_1.__importDefault(Listener_1);
+    const _data = new Map();
     class FileProcessor {
         #container;
         #uploadButton;
@@ -35,6 +36,7 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSui
             this.#container.querySelectorAll("woltlab-core-file").forEach((element) => {
                 this.#registerFile(element, element.parentElement);
             });
+            _data.set(fieldId, this);
         }
         get classPrefix() {
             return this.showBigPreview ? "fileUpload__preview__" : "fileList__";
@@ -289,6 +291,17 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSui
             container.append(input);
             this.addButtons(container, element);
         }
+        get values() {
+            return new Set(Array.from(this.#container.querySelectorAll('input[type="hidden"]')).map((input) => parseInt(input.value, 10)));
+        }
     }
     exports.FileProcessor = FileProcessor;
+    function getValues(fieldId) {
+        const field = _data.get(fieldId);
+        if (field === undefined) {
+            throw new Error("Unknown field with id '" + fieldId + "'");
+        }
+        return field.values;
+    }
+    exports.getValues = getValues;
 });

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/FileProcessor.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/FileProcessor.js
new file mode 100644 (file)
index 0000000..242e565
--- /dev/null
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/FileProcessor.js
@@ -0,0 +1,24 @@
+/**
+ * Data handler for a file processor form builder field in an Ajax form.
+ *
+ * @author      Olaf Braun
+ * @copyright   2001-2024 WoltLab GmbH
+ * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @since       6.1
+ */
+define(["require", "exports", "tslib", "WoltLabSuite/Core/Form/Builder/Field/Field", "WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor"], function (require, exports, tslib_1, Field_1, FileProcessor_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    Field_1 = tslib_1.__importDefault(Field_1);
+    class FileProcessor extends Field_1.default {
+        _getData() {
+            return {
+                [this._fieldId]: (0, FileProcessor_1.getValues)(this._fieldId),
+            };
+        }
+        _readField() {
+            // does nothing
+        }
+    }
+    exports.default = FileProcessor;
+});

diff --git a/wcfsetup/install/files/lib/system/form/builder/field/FileProcessorFormField.class.php b/wcfsetup/install/files/lib/system/form/builder/field/FileProcessorFormField.class.php
index 62b6dc3482b373f9654800bf8e870bdceca0892d..4da671a60e90af786062939450e8adbe1978ab12 100644 (file)
--- a/wcfsetup/install/files/lib/system/form/builder/field/FileProcessorFormField.class.php
+++ b/wcfsetup/install/files/lib/system/form/builder/field/FileProcessorFormField.class.php
@@ -29,6 +29,11 @@ final class FileProcessorFormField extends AbstractFormField
      */
     protected $templateName = 'shared_fileProcessorFormField';
 
+    /**
+     * @inheritDoc
+     */
+    protected $javaScriptDataHandlerModule = 'WoltLabSuite/Core/Form/Builder/Field/FileProcessor';
+
     private array $context = [];
 
     /**