const url = 'https://url/api/v1/students/'
function EditSingleStudent() {
const { data, isLoading:isApiLoading, error:isApiError } = useApi(`${url}/${id}`)
const {classLists, isLoading, error} = useGetClasses();
const formik = useFormik({
initialValues: {
studentId: '',
name: '',
profile: '',
dateOfBirth: '',
gender: '',
bloodGroup: '',
email: '',
phone: '',
country: 'Bangladesh',
username: '',
password: '',
fatherName: '',
motherName: '',
fatherProfession: '',
motherProfession: '',
fatherPhone: '',
fatherNID: '',
motherPhone: '',
motherNID: '',
classLevel: '',
section: '',
},
validationSchema: Yup.object().shape({
studentId: Yup.string(),
name: Yup.string(),
profile: Yup.string(),
dateOfBirth: Yup.date(),
gender: Yup.string(),
bloodGroup: Yup.string(),
email: Yup.string().email('Invalid email format'),
phone: Yup.string(),
country: Yup.string(),
username: Yup.string(),
password: Yup.string(),
fatherName: Yup.string(),
motherName: Yup.string(),
fatherProfession: Yup.string(),
motherProfession: Yup.string(),
fatherPhone: Yup.string(),
fatherNID: Yup.string(),
motherPhone: Yup.string(),
motherNID: Yup.string(),
classLevel: Yup.string(),
section: Yup.string(),
}),
enableReinitialize: true,
onSubmit: async (values, {resetForm}) => {
try {
setLoading(true)
if (!values.name) {
toast.error("Please enter a name for the student.");
return; // Prevent form submission if name is empty
}
console.log("Values: ", values)
const headers = {
"Authorization": authHeader,
'Content-Type': 'multipart/form-data',
}
const response = await axios.put(`https://url/api/v1/students/update/${id}`, values, {headers: headers});
console.log('Registration successful:', response.data);
toast(response.data.message)
if (response.status === 200) {
// Reset the form after successful submission
setLoading(false)
resetForm();
} else{
setLoading(false)
}
} catch (error) {
// Handle errors
console.error('Error:', error);
toast(error.message)
setLoading(false)
}
}
});
useEffect(() => {
if (!isApiLoading && data) {
formik.setValues({
studentId: data.studentId || '',
name: data.name || '',
profile: data.profile || '',
dateOfBirth: data.dateOfBirth || '',
gender: data.gender || '',
bloodGroup: data.bloodGroup || '',
email: data.email || '',
phone: data.phone || '',
country: data.country || 'Bangladesh',
username: data.username || '',
password: data.password || '',
fatherName: data.fatherName || '',
motherName: data.motherName || '',
fatherProfession: data.fatherProfession || '',
motherProfession: data.motherProfession || '',
fatherPhone: data.fatherPhone || '',
fatherNID: data.fatherNID || '',
motherPhone: data.motherPhone || '',
motherNID: data.motherNID || '',
classLevel: data.classLevel?._id || '',
section: data.section?._id || '',
});
}
}, [isApiLoading, data]);
Here I am sending the name but still, it's not sending over api. and also is there any better way to initialize the initialValues in formik and to merged it with touched values? The form is not submitting at all. I don't know why. any help please?
This code I want to use to uplaod profile information so the untouched field should be as it is and the upadated values should be added to the database but it's not submitting the form at all it says name path is require when I try to submit the form. I don't know why