From a214d6d85afac6e3122c676e2413a8d2f35e1c5d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mose=20M=C3=BCller?= <mosemueller@gmail.com>
Date: Mon, 29 Apr 2024 15:26:13 +0200
Subject: [PATCH] using id as form name for number and string component

This removes errors saying that quotes within element name are not allowed.
---
 frontend/src/components/NumberComponent.tsx | 6 ++----
 frontend/src/components/StringComponent.tsx | 2 +-
 2 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/NumberComponent.tsx b/frontend/src/components/NumberComponent.tsx
index fefc02c..cc269f5 100644
--- a/frontend/src/components/NumberComponent.tsx
+++ b/frontend/src/components/NumberComponent.tsx
@@ -328,9 +328,7 @@ export const NumberComponent = React.memo((props: NumberComponentProps) => {
 
   useEffect(() => {
     // Set the cursor position after the component re-renders
-    const inputElement = document.getElementsByName(
-      fullAccessPath
-    )[0] as HTMLInputElement;
+    const inputElement = document.getElementsByName(id)[0] as HTMLInputElement;
     if (inputElement && cursorPosition !== null) {
       inputElement.setSelectionRange(cursorPosition, cursorPosition);
     }
@@ -353,7 +351,7 @@ export const NumberComponent = React.memo((props: NumberComponentProps) => {
           value={inputString}
           disabled={readOnly}
           onChange={() => {}}
-          name={fullAccessPath}
+          name={id}
           onKeyDown={handleKeyDown}
           onBlur={handleBlur}
           className={isInstantUpdate && !readOnly ? 'instantUpdate' : ''}
diff --git a/frontend/src/components/StringComponent.tsx b/frontend/src/components/StringComponent.tsx
index 1d985a5..654f604 100644
--- a/frontend/src/components/StringComponent.tsx
+++ b/frontend/src/components/StringComponent.tsx
@@ -90,7 +90,7 @@ export const StringComponent = React.memo((props: StringComponentProps) => {
         </InputGroup.Text>
         <Form.Control
           type="text"
-          name={fullAccessPath}
+          name={id}
           value={inputString}
           disabled={readOnly}
           onChange={handleChange}