Radiobuttons OHNE OK

src/components/FandStattVer.jsx

@@ -5,47 +5,29 @@ import Modal from './Modal'
 export default function FandStattVer({left, right, title, onNext, radioName = "fst"}) {
     const { formData, updateFormData } = useFormData()
     const [auswahl, setAuswahl] = useState(formData.stattgefunden || '')
-    const [showModal, setShowModal] = useState(false)
     
-    const handleOK = () => {
+    const handleRadioChange = (e) => {
-        if(!auswahl) {
+        const value = e.target.value
-            setShowModal(true)
+        setAuswahl(value)
-            return
+        updateFormData('stattgefunden', value)
-        }
+        onNext(value)
-        updateFormData('stattgefunden', auswahl)
-        onNext(auswahl)
-    }
-
-    const closeModal = () => {
-        setShowModal(false)
     }
 
     return (
-        <>
         <section>
             <h3>{title}</h3>
             <div className="fstdiv">
                 <label className="fsLabel">
                     <input type="radio" name={radioName} value={left} checked={auswahl === left}
-                            onChange = {(e) => setAuswahl(e.target.value)} />
+                        onChange={handleRadioChange} />
                     {left}
                 </label>
                 <label className="fsLabel">
                     <input type="radio" name={radioName} value={right} checked={auswahl === right}
-                            onChange = {(e) => setAuswahl(e.target.value)} />
+                        onChange={handleRadioChange} />
                     {right}
                 </label>
-                    <button className="okbutton"  onClick={handleOK}>OK</button>
             </div>
         </section>
-            
-            <Modal 
-                isOpen={showModal} 
-                onClose={closeModal}
-                title="Auswahl erforderlich"
-            >
-                <p>Bitte eine Option wählen</p>
-            </Modal>
-        </>
     )
 }