Error when submitting form "TypeError: Cannot read properties of undefined (reading 'first-CodePudding

I tried to submitted the input from my add.ejs to send it to my mongodb.

add.ejs

<body>
<div >
    <div >
        <div >
            <form  method="POST" action="/insert" enctype="multipart/form-data">
                <div >
                    <div style="height: 125px;"></div>
                    <label >Picture: </label>
                    <div >
                        <input type="file"  style= "background-color: #1E0E81;
                        color: white; " name="image">
                    </div>
                </div>
                <div >
                    <label >First Name: </label>
                    <div >
                        <input type="text"  style= "background-color: #1E0E81;
                        color: white;" name="firstName">
                    </div>
                </div>
                <div >
                    <label >Last Name: </label>
                    <div >
                        <input type="text"  style= "background-color: #1E0E81;
                        color: white; " name="lastName">
                    </div>
                </div>
                <div >
                    <label >Email: </label>
                    <div >
                        <input type="text"  style= "background-color: #1E0E81;
                        color: white; " name="email">
                    </div>
                </div>
                <div >
                    <label >Telephone: </label>
                    <div >
                        <input type="text"  style= "background-color: #1E0E81;
                        color: white; " name="telephone">
                    </div>
                </div>
                <div >
                    <label >Description: </label>
                    <div >
                        <input type="text"  style= "background-color: #1E0E81;
                        color: white; " name="description">
                    </div>
                </div><br>
                <div >
                    <div >
                        <button type="submit" >Submit</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

Now and then, I got an error "Cannot POST /insert". So I tried to console.log first to see what the error is and I got error message "TypeError: Cannot read properties of undefined (reading 'firstName')"

Here is my routes file.

myRouter.js

const express =require('express')
const router = express.Router()


const Gallery = require('../models/gallery') 


const multer = require('multer')

const storage = multer.diskStorage({
    destination:function(req,file,cb){
        cb(null,'./public/image/galleries') 
    },
    filename:function(req,file,cb){
        cb(null,Date.now() ".jpg") 
    }
})


const upload = multer({
    storage:storage
})

router.get('/',(req,res)=>{
    Gallery.find().exec((err,doc)=>{
        res.render('home.ejs',{gallery:doc})
    })
})

router.get('/donate',(req,res)=>{
    res.render('donate.ejs')
})

router.get('/add',(req,res)=>{
    res.render('add.ejs')
})

router.post('/insert'),upload.single("image"),(req,res)=>{
    let data = new Gallery({
        firstName:req.body.firstName,
        lastName:req.body.lastName,
        email:req.body.email,
        telephone:req.body.telephone,
        description:req.body.description,
        image:req.file.filename
    })
    Gallery.saveGallery(data,(err)=>{
        if(err) console.log(err)
        res.redirect('/')
    }) 
}
// router.post('/insert',(req,res)=>{
//     console.log(req.body.firstName),
//     console.log(req.body.lastName),
//     console.log(req.body.email),
//     console.log(req.body.telephone),
//     console.log(req.body.description),
//     console.log(req.body.image)
//     res.render('add')
// })

module.exports = router

Please help me find out what the problems is

CodePudding user response：

You have a typo in this line:

router.post('/insert'),upload.single("image"),(req,res)=>{

There should not be a closing bracket after '/insert'. Try this:

router.post('/insert',upload.single("image"),(req,res)=>{