• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录
LilyLiya
博客园    首页    新随笔    联系   管理    订阅  订阅
new-Category-default category show

动态添加category

const categories = ['fruit', 'vagetable', 'diary', 'unique'];
app.get(
'/products/new', (req, res) => { res.render('products/new', { categories }) })
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>New product</title>
</head>

<body>
    <h1>Add a product </h1>
    <form action="/products" method="POST">
        <label for="name">Name</label>
        <input type="text" name="name" id="name" placeholder="product name">
        <label for="price">price</label>
        <input type="number" name="price" id="price" placeholder="price">
        <label for="category">Select category</label>
        <select name="category" id="category">
            <%for(let category of categories){%>
                <option value="<%=category>">
                    <%=category>
                </option>
                <%}%>
        </select>
        <button>Submit</button>
        <!-- Submit按钮一旦点击,提交页面/products, post,跟index.js里面的app.post('/products',...)连接着 -->
    </form>
</body>

</html>

new.ejs

<!
DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>New product</title> </head> <body> <h1>Add a product </h1> <form action="/products" method="POST"> <label for="name">Name</label> <input type="text" name="name" id="name" placeholder="product name"> <label for="price">price</label> <input type="number" name="price" id="price" placeholder="price"> <label for="category">Select category</label> <select name="category" id="category"> <%for(let category of categories){%> <option value="<%=category>"> <%=category> </option> <%}%> </select> <button>Submit</button> <!-- Submit按钮一旦点击,提交页面/products, post,跟index.js里面的app.post('/products',。。。)连接着 --> </form> </body> </html>
edit.ejs

<!
DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Edit product</title> </head> <body> <h1>Edit a product </h1> <form action="/products/<%=product._id%>?_method=PUT" method="POST"> <label for="name">Name</label> <input type="text" name="name" id="name" placeholder="product name" value="<%=product.name%>"> <label for="price">price</label> <input type="number" name="price" id="price" placeholder="price" value="<%=product.price%>"> <label for="category">Select category</label> <select name="category" id="category"> <%for(let category of categories){%> <option value="<%=category%>" <%=product.category===category ? 'selected' : '' %>><%=category%> </option> <%}%> </select> <button>Submit</button> <!-- Submit按钮一旦点击,提交页面/products, post,跟index.js里面的app.post('/products',......)连接着 --> </form> <a href="/products/<%=product._id%>">Cancel</a> </body> </html>
 <option value="<%=category%>" <%=product.category===category ? 'selected' : '' %>><%=category%>
 </option>
设置默认显示的category。

 

posted on 2021-02-11 13:11  LilyLiya  阅读(110)  评论(0)    收藏  举报
刷新页面返回顶部
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3