From 7075e8579e5aa038438be9bbb2ba275d52c20910 Mon Sep 17 00:00:00 2001 From: ks129 <45097959+ks129@users.noreply.github.com> Date: Mon, 8 Feb 2021 19:29:37 +0200 Subject: Implement focusing text fields if empty on submit --- src/pages/FormPage.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'src/pages/FormPage.tsx') diff --git a/src/pages/FormPage.tsx b/src/pages/FormPage.tsx index 8e998c5..50f48ba 100644 --- a/src/pages/FormPage.tsx +++ b/src/pages/FormPage.tsx @@ -199,7 +199,8 @@ function FormPage(): JSX.Element { } const questions = form.questions.map((question, index) => { - return ()} scroll_ref={createRef()} question={question} public_state={new Map()} key={index + Date.now()}/>; + // eslint-disable-next-line @typescript-eslint/no-explicit-any + return ()} focus_ref={createRef()} scroll_ref={createRef()} question={question} public_state={new Map()} key={index + Date.now()}/>; }); async function handleSubmit(event: SyntheticEvent) { @@ -223,6 +224,9 @@ function FormPage(): JSX.Element { const firstErrored = questions[invalidFieldIDs[0]]; if (firstErrored && firstErrored.props.scroll_ref) { firstErrored.props.scroll_ref.current.scrollIntoView({ behavior: "smooth", block: "center" }); + if (firstErrored.props.focus_ref && firstErrored.props.focus_ref.current) { + firstErrored.props.focus_ref.current.focus({ preventScroll: true }); + } } return; } -- cgit v1.2.3