From ec1f68ae4a9887ccab269c7bcdab03afcb64ed49 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mose=20M=C3=BCller?= <mosemueller@gmail.com>
Date: Wed, 17 Apr 2024 09:21:02 +0200
Subject: [PATCH] using fullAccessPath as Form name for NumberComponent fixing
 cursor jumps

---
 frontend/src/components/NumberComponent.tsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/NumberComponent.tsx b/frontend/src/components/NumberComponent.tsx
index 9bbf9dd..b53ebd7 100644
--- a/frontend/src/components/NumberComponent.tsx
+++ b/frontend/src/components/NumberComponent.tsx
@@ -174,7 +174,6 @@ export const NumberComponent = React.memo((props: NumberComponentProps) => {
   // Create a state for the input string
   const [inputString, setInputString] = useState(value.toString());
   const renderCount = useRef(0);
-  const name = fullAccessPath.split('.').at(-1);
 
   const handleKeyDown = (event) => {
     const { key, target } = event;
@@ -329,7 +328,9 @@ export const NumberComponent = React.memo((props: NumberComponentProps) => {
 
   useEffect(() => {
     // Set the cursor position after the component re-renders
-    const inputElement = document.getElementsByName(name)[0] as HTMLInputElement;
+    const inputElement = document.getElementsByName(
+      fullAccessPath
+    )[0] as HTMLInputElement;
     if (inputElement && cursorPosition !== null) {
       inputElement.setSelectionRange(cursorPosition, cursorPosition);
     }
@@ -351,7 +352,7 @@ export const NumberComponent = React.memo((props: NumberComponentProps) => {
           type="text"
           value={inputString}
           disabled={readOnly}
-          name={name}
+          name={fullAccessPath}
           onKeyDown={handleKeyDown}
           onBlur={handleBlur}
           className={isInstantUpdate && !readOnly ? 'instantUpdate' : ''}