I’d like to update the username and the email… the backend is working but the frontend is not updating,
I updated the username and the mail and when I see my update in the frontend, it’s the same nothing happend even though i got the alert “admin updated”, however when i test the backend there is no issue and it’s working .
the backend:
app.put("/admin/:id", (req, res) => {
LoginAdmin.findOneAndUpdate({_id: req.params.id},{
$set:{
email : req.body.email,
adminname: req.body.adminname
}
}, function (err, data) {
if (err){
res.status(500).send(err)
} else {
res.status(200).send({message: 'UPDATED', data: data})
}
})
})
the frontend:
const UpdateAdminAccount = (props) => {
let navigate= useNavigate()
const initialInputValues = {
adminname: '',
email: '',
}
const [values, setValues] = useState(initialInputValues)
//show admin info before updating
const {id} = useParams()
useEffect(()=>{
if(id){
getSingleAdmin(id)
}
},[id])
const getSingleAdmin = async (id) =>{
const response = await axios.get(`/admin/${id}`);
console.log("response", response)
if (response.status === 200){
setValues(response.data);
}
};
const handleInputChange = (e) => {
const name = e.target.name
const value = e.target.value
setValues({
...values,
[name]: value,
})
}
const updateAdmin = async (e, id) =>{
e.preventDefault();
await axios.put(`/admin/${id}`, {
...values
}
).then((res) =>{
console.log(res)
if (res.data.message === 'UPDATED') {
alert("admin updated")
}
})
};
return (
<form method='Post'>
<ul>
<li>
<label>Name</label>
<input name="adminname" value={values.adminname} onChange={handleInputChange} type="text" />
</li>
<li>
<label>Email</label>
<input name="email" value={values.email} onChange={handleInputChange} type="email" />
</li>
<li>
<li>
<button className='submit-button' onClick={updateAdmin} type="submit" >
Update
</button> :
</li>
</ul>
</form>
</div>
</div>
</div>
);
}
export default UpdateAdminAccount;