admin/beoanswer_react
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Radiobuttons OHNE OK

Browse Source
This commit is contained in:
rxf
2025-10-27 17:24:48 +01:00
parent 1c153db116
commit dd32ad585e
1 changed files with 20 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
src/components/FandStattVer.jsx
View File

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