提交表单时的错误“ TypeError：无法读取未定义的属性（Reading＆＃x27; firstName;）;

发布于 2025-01-25 02:41:43 字数 4899 浏览 3 评论 0原文

我试图从add.ejs提交输入，以将其发送给我的mongoDB。

add.ejs

<body>
<div class="container">
    <div class="row my-3 justify-content-md-center">
        <div class="col-md-8 mb-4">
            <form class="form-horizontal" method="POST" action="/insert" enctype="multipart/form-data">
                <div class="form-group">
                    <div style="height: 125px;"></div>
                    <label class="control-label col-sm-2">Picture: </label>
                    <div class="col-sm-10">
                        <input type="file" class="form-control" style= "background-color: #1E0E81;
                        color: white; " name="image">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2">First Name: </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" style= "background-color: #1E0E81;
                        color: white;" name="firstName">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2">Last Name: </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" style= "background-color: #1E0E81;
                        color: white; " name="lastName">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2">Email: </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" style= "background-color: #1E0E81;
                        color: white; " name="email">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2">Telephone: </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" style= "background-color: #1E0E81;
                        color: white; " name="telephone">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2">Description: </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" style= "background-color: #1E0E81;
                        color: white; " name="description">
                    </div>
                </div><br>
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" class="btn btn-primary">Submit</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

时不时地出现了一个错误“ 无法发布/插入”。因此，我尝试首先要委托。log以查看错误，并且收到了错误消息“ typeError：无法读取未定义的属性（读取'firstName'） “

这是我的路由文件。

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

请帮助我找出问题是什么

原文

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

add.ejs

<body>
<div class="container">
    <div class="row my-3 justify-content-md-center">
        <div class="col-md-8 mb-4">
            <form class="form-horizontal" method="POST" action="/insert" enctype="multipart/form-data">
                <div class="form-group">
                    <div style="height: 125px;"></div>
                    <label class="control-label col-sm-2">Picture: </label>
                    <div class="col-sm-10">
                        <input type="file" class="form-control" style= "background-color: #1E0E81;
                        color: white; " name="image">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2">First Name: </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" style= "background-color: #1E0E81;
                        color: white;" name="firstName">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2">Last Name: </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" style= "background-color: #1E0E81;
                        color: white; " name="lastName">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2">Email: </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" style= "background-color: #1E0E81;
                        color: white; " name="email">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2">Telephone: </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" style= "background-color: #1E0E81;
                        color: white; " name="telephone">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-sm-2">Description: </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" style= "background-color: #1E0E81;
                        color: white; " name="description">
                    </div>
                </div><br>
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" class="btn btn-primary">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

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

野生奥特曼 2025-02-01 02:41:43

您在此行中有一个错别字：

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

'/insert'之后，不应有关闭括号。尝试以下操作：

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

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)=>{

回复收藏 0 原文

~没有更多了~

关于作者

夢归不見

暂无简介

文章

27 人气

关注发私信

alipaysp_snBf0MSZIv

文章 0 评论 0

关注

梦断已成空

文章 0 评论 0

关注

瞎闹

文章 0 评论 0

关注

凯凯我们等你回来

文章 0 评论 0

关注

寄意

文章 0 评论 0

关注

似梦非梦

文章 0 评论 0

友情链接

文江博客

提交表单时的错误“ TypeError：无法读取未定义的属性（Reading＆＃x27; firstName;）;

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

评论（1）

关于作者

相关话题

热门标签

推荐作者

alipaysp_snBf0MSZIv

梦断已成空

瞎闹

凯凯我们等你回来

寄意

似梦非梦

友情链接

提交表单时的错误“ TypeError：无法读取未定义的属性（Reading＆＃x27; firstName;）;

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

评论（1）

关于作者

相关话题

热门标签

推荐作者

alipaysp_snBf0MSZIv

梦断已成空

瞎闹

凯凯我们等你回来

寄意

似梦非梦

友情链接

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。