disable buttons and inputs while post. close #37

This commit is contained in:
2020-04-30 21:56:43 +02:00
parent 083f73ec2b
commit 4848b32b1a
2 changed files with 14 additions and 3 deletions

View File

@@ -66,6 +66,7 @@ export default function CreateAccount() {
const [password, setPassword] = React.useState("");
const [login, setLogin] = React.useState(true);
const [status, setStatus] = React.useState(null);
const [button, setButton] = React.useState(false);
const putCreateAccount = async (url, data) => {
const response = await fetch(url, {
@@ -83,10 +84,12 @@ export default function CreateAccount() {
if (response.status == "200") {
setLogin(false)
}
setButton(false)
setTimeout(() => { setStatus(null) }, 5000)
}
const handleClick = (e) => {
if (username !== "" && password !== "") {
setButton(true)
putCreateAccount(url, { email: username, password: password })
setUsername("")
@@ -97,6 +100,7 @@ export default function CreateAccount() {
const handleKeyDown = (e) => {
if (e.keyCode == 13) {
if (username !== "" && password !== "") {
setButton(true)
putCreateAccount(url, { email: username, password: password })
setUsername("")
@@ -140,6 +144,7 @@ export default function CreateAccount() {
value={username}
className={classes.input}
onKeyDown={handleKeyDown}
disabled={button}
/>
</Box >
</Grid>
@@ -156,12 +161,13 @@ export default function CreateAccount() {
onChange={handleChangePW}
className={classes.input}
onKeyDown={handleKeyDown}
disabled={button}
/>
</Box >
</Grid>
<Grid item xs={12}>
<Box display="flex" justifyContent="center" >
<Button variant="contained" color="secondary" onClick={handleClick} >
<Button disabled={button} variant="contained" color="secondary" onClick={handleClick} >
Create Account
</Button>
</Box >

View File

@@ -68,6 +68,7 @@ export default function Login() {
const [password, setPassword] = React.useState("");
const [login, setLogin] = React.useState(true);
const [status, setStatus] = React.useState(null);
const [button, setButton] = React.useState(false);
const postLogin = async (url, data) => {
@@ -86,13 +87,14 @@ export default function Login() {
if (response.status == "200") {
setLogin(false)
}
setButton(false)
setTimeout(() => { setStatus(null) }, 5000)
}
const handleClick = (e) => {
if (username !== "" && password !== "") {
setButton(true)
postLogin(url, { email: username, password: password })
setUsername("")
@@ -103,6 +105,7 @@ export default function Login() {
const handleKeyDown = (e) => {
if (e.keyCode == 13) {
if (username !== "" && password !== "") {
setButton(true)
postLogin(url, { email: username, password: password })
setUsername("")
@@ -149,6 +152,7 @@ export default function Login() {
onChange={handleChangeUSR}
className={classes.input}
onKeyDown={handleKeyDown}
disabled={button}
/>
</Box >
</Grid>
@@ -165,6 +169,7 @@ export default function Login() {
onChange={handleChangePW}
className={classes.input}
onKeyDown={handleKeyDown}
disabled={button}
/>
</Box >
</Grid>
@@ -179,7 +184,7 @@ export default function Login() {
</Grid>
<Grid item xs={12}>
<Box display="flex" justifyContent="center" >
<Button variant="contained" color="secondary" onClick={handleClick}>
<Button disabled={button} variant="contained" color="secondary" onClick={handleClick}>
Login
</Button>
</Box >