validate registration

This commit is contained in:
Mikola 2023-11-19 18:50:04 +03:00
parent c69adb0d14
commit 3f5f221702

View File

@ -23,8 +23,8 @@ export const ModalRegistration = ({ active, setActive }) => {
const [inputsError, setInputsError] = useState({
name: false,
email: false,
password: false
})
password: false,
});
const validateEmail = (email) => {
// регулярное выражение для проверки email
@ -46,22 +46,26 @@ export const ModalRegistration = ({ active, setActive }) => {
const validateForm = () => {
if (inputsValue.password.length < 6) {
setInputsError((prevValue) => ({...prevValue, password: true}))
setInputsError((prevValue) => ({ ...prevValue, password: true }));
}
if (inputsValue.userName.length < 6) {
setInputsError((prevValue) => ({...prevValue, name: true}))
setInputsError((prevValue) => ({ ...prevValue, name: true }));
}
if (!validateEmail(inputsValue.email)) {
setInputsError((prevValue) => ({...prevValue, email: true}))
}
if (inputsValue.password.length < 6 || inputsValue.userName.length < 6 || !validateEmail(inputsValue.email)) {
return true
setInputsError((prevValue) => ({ ...prevValue, email: true }));
}
if (
inputsValue.password.length < 6 ||
inputsValue.userName.length < 6 ||
!validateEmail(inputsValue.email)
) {
return true;
}
};
const submitHandler = () => {
if(validateForm()) {
return
if (validateForm()) {
return;
}
apiRequest("/register/sign-up", {
method: "POST",
@ -101,75 +105,69 @@ export const ModalRegistration = ({ active, setActive }) => {
<div className="input-body">
<div className="input-body__box">
<div className='inputContainer'>
<div className="inputContainer">
<h5>Ваше имя</h5>
<input
className={inputsError.name ? 'error' : ''}
className={inputsError.name ? "error" : ""}
onChange={(e) => {
setInputsError({
name: false,
email: false,
password: false
})
password: false,
});
setInputsValue((prevValue) => ({
...prevValue,
userName: e.target.value,
}))
}));
}}
placeholder="Name"
/>
{inputsError.name &&
<span>Минимум 6 символов</span>
}
{inputsError.name && <span>Минимум 6 символов</span>}
</div>
<div className='inputContainer'>
<div className="inputContainer">
<h5>E-mail</h5>
<input
type="email"
className={inputsError.email ? 'error' : ''}
className={inputsError.email ? "error" : ""}
onChange={(e) => {
setInputsError({
name: false,
email: false,
password: false
})
password: false,
});
setInputsValue((prevValue) => ({
...prevValue,
email: e.target.value,
}))
}));
}}
placeholder="Email"
/>
{inputsError.email &&
<span>Введите коректный email</span>
}
{inputsError.email && <span>Введите коректный email</span>}
</div>
</div>
<div className="input-body__box">
{/*<h5>Название компании</h5>*/}
{/*<input></input>*/}
<div className='inputContainer'>
<div className="inputContainer">
<h5>Пароль</h5>
<input
className={inputsError.password ? 'error' : ''}
className={inputsError.password ? "error" : ""}
type="password"
onChange={(e) => {
setInputsError({
name: false,
email: false,
password: false
})
password: false,
});
setInputsValue((prevValue) => ({
...prevValue,
password: e.target.value,
}))
}));
}}
placeholder="Password"
/>
{inputsError.password &&
<span>Минимум 6 символов</span>
}
{inputsError.password && <span>Минимум 6 символов</span>}
</div>
</div>
</div>