From 276c39cf8cd906e99bdd798024d91b3161690ab2 Mon Sep 17 00:00:00 2001
From: Alberto Defendi <1369-ahl-berto@users.noreply.gitlab.inf.unibz.it>
Date: Sat, 20 Mar 2021 16:44:49 +0100
Subject: [PATCH] Simple form
---
src/components/TestForm/index.tsx | 30 ++++++++++++++++++++++++------
1 file changed, 24 insertions(+), 6 deletions(-)
diff --git a/src/components/TestForm/index.tsx b/src/components/TestForm/index.tsx
index dc6abb2..e98b471 100644
--- a/src/components/TestForm/index.tsx
+++ b/src/components/TestForm/index.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
import { createStyles, makeStyles, Theme } from '@material-ui/core/styles';
import TextField from '@material-ui/core/TextField';
import Button from '@material-ui/core/Button';
@@ -23,10 +23,26 @@ const useStyles = makeStyles((theme: Theme) =>
);
export const Form: React.FC = () => {
+ interface formData {
+ email: string;
+ password: string;
+ }
+
+ const defaultValues: formData = {
+ email: '',
+ password: '',
+ };
+ const [formValues, setFormValues] = useState<formData>(defaultValues);
+
+ const handleSubmit: any = (event: any) => {
+ event.preventDefault();
+ console.log(formValues);
+ };
+
const classes = useStyles();
return (
- <form className={classes.form} noValidate>
+ <form className={classes.form} onSubmit={handleSubmit}>
<TextField
variant="outlined"
margin="normal"
@@ -37,6 +53,9 @@ export const Form: React.FC = () => {
name="email"
autoComplete="email"
autoFocus
+ onChange={(event) =>
+ setFormValues({ ...formValues, email: String(event.target.value) })
+ }
/>
<TextField
variant="outlined"
@@ -48,10 +67,9 @@ export const Form: React.FC = () => {
type="password"
id="password"
autoComplete="current-password"
- />
- <FormControlLabel
- control={<Checkbox value="remember" color="primary" />}
- label="Remember me"
+ onChange={(event) =>
+ setFormValues({ ...formValues, password: String(event.target.value) })
+ }
/>
<Button
type="submit"
--
GitLab