78 lines
2.4 KiB
JavaScript
78 lines
2.4 KiB
JavaScript
|
import { useState } from "react";
|
||
|
|
||
|
export const useFormValidation = () => {
|
||
|
// Состояние формы, содержащее значения полей
|
||
|
const [formData, setFormData] = useState({
|
||
|
name: "",
|
||
|
summary: "",
|
||
|
email: "",
|
||
|
tg: "",
|
||
|
password: "",
|
||
|
secondPassword: ""
|
||
|
});
|
||
|
|
||
|
// Состояние ошибок валидации
|
||
|
const [validationErrors, setValidationErrors] = useState({});
|
||
|
|
||
|
// Функция для обработки изменений в полях ввода
|
||
|
const handleChange = (e) => {
|
||
|
const { id, value } = e.target;
|
||
|
setFormData((prevData) => ({ ...prevData, [id]: value }));
|
||
|
};
|
||
|
|
||
|
// Функция для валидации формы
|
||
|
const validateForm = () => {
|
||
|
const errors = {};
|
||
|
|
||
|
if (formData.name.trim() === "") {
|
||
|
errors.name = "Имя обязательно к заполнению";
|
||
|
}
|
||
|
|
||
|
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
||
|
if (formData.email.trim() === "") {
|
||
|
errors.email = "E-mail обязателен к заполнению";
|
||
|
} else if (!emailRegex.test(formData.email)) {
|
||
|
errors.email = "Неверный адрес электронной почты";
|
||
|
}
|
||
|
|
||
|
if (formData.tg.trim() === "") {
|
||
|
errors.tg = "Telegram обязателен к заполнению";
|
||
|
}
|
||
|
|
||
|
if (formData.password.trim() === "") {
|
||
|
errors.password = "Пароль обязателен к заполнению";
|
||
|
} else if (formData.password.length < 8) {
|
||
|
errors.password = "Пароль должен содержать более 8 символов";
|
||
|
}
|
||
|
|
||
|
if (formData.secondPassword.trim() === "") {
|
||
|
errors.secondPassword = "Повторите пароль";
|
||
|
} else if (formData.secondPassword !== formData.password) {
|
||
|
errors.secondPassword = "Пароли должны совпадать";
|
||
|
}
|
||
|
|
||
|
setValidationErrors(errors);
|
||
|
|
||
|
// Возвращаем true, если ошибок нет, иначе - false
|
||
|
return Object.keys(errors).length === 0;
|
||
|
};
|
||
|
|
||
|
// Функция для обработки отправки формы
|
||
|
const handleSubmit = (e) => {
|
||
|
e.preventDefault();
|
||
|
|
||
|
if (validateForm()) {
|
||
|
alert("Форма успешно отправлена!");
|
||
|
} else {
|
||
|
alert("Пожалуйста, заполните форму правильно.");
|
||
|
}
|
||
|
};
|
||
|
|
||
|
return {
|
||
|
formData,
|
||
|
validationErrors,
|
||
|
handleChange,
|
||
|
handleSubmit
|
||
|
};
|
||
|
};
|