使用带有 express.js、hbs 和 mongodb 的 nodejs 从电子商务网站项目的管理面板编辑产品

Question

编辑按钮

                    <td>
                        <a href="/admin/edit-product/{{this._id}}" class="btn btn-primary">edit</a>
                    </td>

我给编辑按钮

router.get 的编辑产品 link

var ProductHelpers = require('../helpers/product-helpers')
router.get('/edit-product/:id',async (req,res)=>{
  let product=await ProductHelpers.getProductDetails(req.params.id)
  console.log(product)
  res.render('admin/edit-products',{product})
}) {{!--here i have rendered edit products page and passed product variable --}}

编辑-products.hbs页面

section>
<div class="container">
    <div class="row mt-4">
        <div class="col-md-6">
            <h2 class="text-center">Edit Products</h2>
            <form action="/admin/edit-product/:{{product._id}}" method="post" enctype="multipart/form-data">
                <label for="">Number</label>
                <input name="no" class="form-control" type="text" value="{{product.no}}">

                <label for="">Name</label>
                <input name="name" class="form-control" type="text" value="{{product.name}}">

                <label for="">Catagery</label>
                <input name="catagery" class="form-control" type="text" value="{{product.catagery}}">

                <label for="">Price</label>
                <input name="price" class="form-control" type="text" value="{{product.price}}">

                <label for="">Description</label>
                <input name="description" class="form-control" type="text" value="{{product.description}}">

                {{!-- <label for="">Image</label>
                <input name="image" class="form-control" type="file"> --}}

                <button type="submit" class="btn btn-primary mt-4">Update</button>
            </form>
        </div>
    </div>
</div>

** link 编辑产品的 router.post 我在编辑-products.hbs 页面的表单操作中提供的产品**

var ProductHelpers = require('../helpers/product-helpers')
router.post('/edit-product/:id',(req,res) => {
  ProductHelpers.updateProducts(req.params.id,req.body).then(()=>{
    res.redirect('/admin/')
  })
})

产品-helpers.js页面

getProductDetails:(Proid)=>{
    return new Promise((resolve,reject)=> {
        db.get().collection(collection.PRODUCT_COLLECTION).findOne({_id:objectId(Proid)}).then((product)=>{
            resolve(product)
        })
    })
},
updateProducts:(Proid,ProDetails)=>{
    return new Promise ((resolve,reject)=>{
        db.get().collection(collection.PRODUCT_COLLECTION).updateOne({_id:objectId(Proid)},{
            $set:{
                no:ProDetails.no,
                name:ProDetails.name,
                catagery:ProDetails.catagery,
                catagery:ProDetails.price,
                description:ProDetails.description,
            }
        }).then((response)=>{
            resolve()
        })
    })
}

浏览器 浏览器中的编辑按钮 edit button

当我点击编辑按钮时，它会将我带到这个页面 edit product page

一切正常！..但问题是下一个 我更改了号码并点击了更新 结果是 result in browser

同时控制台的结果是：- console result

我希望我已经正确解释并且你已经明白了一切，如果你知道解决请帮助我，如果你对我的问题有任何疑问就问我。

Answer 1

注意 <form> 操作中的 :，将其更改为：

<form action="/admin/edit-product/{{product._id}}" method="post" enctype="multipart/form-data">

使用带有 express.js、hbs 和 mongodb 的 nodejs 从电子商务网站项目的管理面板编辑产品

edit a product from admin panel of eCommerce website project using nodejs with express.js, hbs and mongodb

javascript

mongodb

node.js

express