From aaa26c103d76963e4863ae46a7095bb7af93f33a Mon Sep 17 00:00:00 2001
From: ks129 <45097959+ks129@users.noreply.github.com>
Date: Mon, 18 Jan 2021 20:09:32 +0200
Subject: Implement Select field required check

---
 src/components/Question.tsx | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

(limited to 'src/components/Question.tsx')

diff --git a/src/components/Question.tsx b/src/components/Question.tsx
index 3994950..06dceb1 100644
--- a/src/components/Question.tsx
+++ b/src/components/Question.tsx
@@ -29,7 +29,11 @@ class RenderedQuestion extends React.Component<QuestionProp> {
             this.blurHandler = this.on_blur_textarea_handler.bind(this);
         } else {
             this.handler = this.normal_handler.bind(this);
-            this.blurHandler = this.on_blur_handler.bind(this);
+            if (props.question.type === QuestionType.Select) {
+                this.blurHandler = this.on_blur_select_handler.bind(this);
+            } else {
+                this.blurHandler = this.on_blur_handler.bind(this);
+            }
         }
         this.setPublicState("valid", true);
         this.setPublicState("error", "");
@@ -46,7 +50,7 @@ class RenderedQuestion extends React.Component<QuestionProp> {
 
     // This is here to allow dynamic selection between the general handler, and the textarea handler.
     handler(_: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>): void {} // eslint-disable-line
-    blurHandler(_: FocusEvent<HTMLInputElement | HTMLTextAreaElement>): void {} // eslint-disable-line
+    blurHandler(_: FocusEvent<HTMLInputElement | HTMLTextAreaElement | HTMLDivElement>): void {} // eslint-disable-line
 
     normal_handler(event: ChangeEvent<HTMLInputElement>): void {
         let target: string;
@@ -111,6 +115,17 @@ class RenderedQuestion extends React.Component<QuestionProp> {
         }
     }
 
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    on_blur_select_handler(_: FocusEvent<HTMLDivElement>): void {
+        if (this.props.question.required && !this.props.public_state.get("value")) {
+            this.setPublicState("error", "Field must be filled.");
+            this.setPublicState("valid", false);
+        } else {
+            this.setPublicState("error", "");
+            this.setPublicState("valid", true);
+        }
+    }
+
     on_blur_textarea_handler(event: FocusEvent<HTMLTextAreaElement>): void {
         if (this.props.question.required && event.target.value === "") {
             this.setPublicState("error", "Field must be filled.");
-- 
cgit v1.2.3