This is my react componant i was try to send form data in express js but server doesn't get any data there was show undefine when i console the data please help mee This is my react componant i was try to send form data in express js but server doesn't get any data there was show undefine when i console the data please help mee This is my react componant i was try to send form data in express js but server doesn't get any data there was show undefine when i console the data please help mee
import React, { useState } from 'react';
const UserUploadFile = () => {
const[Info,setInfo]= useState({});
const[file,setFile]=useState({});
const handleBlur=(e)=>{
const newInfo ={...Info};
newInfo[e.target.name]=e.target.value;
setInfo(newInfo);
}
const handleFileChange=e=>{
const newFile= e.target.files[0];
setFile(newFile);
}
const handleSubmit=e=>{
e.preventDefault() ;
const formData = new FormData()
formData.append('File', file)
formData.append('name', Info.name)
formData.append('testName', Info.testName)
formData.append('Date', Info.date)
console.log(Object.fromEntries(formData))
fetch('/Upload/UserReport', {
method: 'POST',
body: formData,
})
.then(response => response.json())
.then(data => {
console.log(data)
})
.catch(error => {
console.error(error)
})
}
return (
<div class="account">
<div class="login">
<form onSubmit={handleSubmit}>
<h2>Upload Your File</h2>
<input
type="text"
name="name"
onBlur={handleBlur}
placeholder="User Name"
required
/>
<input
type="text"
name="testName"
onBlur={handleBlur}
placeholder="Test Name"
required
/>
<input
type="date"
name="date"
onBlur={handleBlur}
placeholder="date"
required
/>
<input
type="file"
name="files"
onChange={handleFileChange}
placeholder="Upload Jpg png Jpeg Image"
required
/>
<button type="submit" name="reg" value="submit">
<b>Upload File</b>
</button>
</form>
</div>
</div>
);
};
export default UserUploadFile;
This is backend part
const express = require("express");
const mongoose = require("mongoose");
const router = express.Router();
const UploadFileUser = require("../Scheema/UploadFileUser");
const User= new mongoose.model("UploadFileUser", UploadFileUser);
const CheakLoginControler = require('../MiddleWears/CheakLoginControler');
const fileUpload = require('express-fileupload')
router.post("/UserReport",async(req,res)=>{
console.log(req.body.name)
const file= req.files;
const name= req.body.name;
console.log(name,file)
})
module.exports = router;
I expact my formData will show in the server