将值从 db 传递到下拉菜单答案

【问题标题】：pass value from db to dropdown menu将值从 db 传递到下拉菜单
【发布时间】：2018-01-10 05:18:30
【问题描述】：

我正在尝试从我的数据库中传递值以在我的视图中进行下拉：这是我项目中的一个 js 文件：

newproject.js：

var express = require('express');
var router = express.Router();
var sql = require ('mssql');


router.get('/', function(req, res, next) {
    res.render('newProject');
});


const config = {
    user: 'sa',
    password: 'password',
    server: 'localhost\\SQLEXPRESS', // You can use 'localhost\\instance' to connect to named instance
    database: 'pcgdb',

    options: {
        encrypt: false // Use this if you're on Windows Azure
    }
};


sql.connect(config).then(() => {
    return sql.query`select Project_Type_Desc from Project_Type`
}).then(result => {
    console.log(result)
}).catch(err => {
    console.log(err)
})



module.exports = router;

这是对应的视图：

index.ejs

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>PCG WEB APP</title>
</head>

<body>
<h1>Please input a new project</h1>
    <form class="form-horizontal" role="form" style="width: 50%;">
            <label for="sel1">Region : </label>
            <select class="form-control" id="sel1">
                <option>EMEA</option>
                <option>APAC</option>
                <option>AMER</option>
            </select>
    Country :
    <input type="text" name="coutry"><br>
    City:
    <input type="text" name="city"><br>
    Requested By :
    <input type="text" name="request_by"><br>
    Project Responsibility:
    <input type="text" name="project_responsibility"><br>
    Facility Classification:
    <input type="radio" name="facilityclassification" value="new" checked> New
    <input type="radio" name="facilityclassification" value="existing"> Existing<br>
            <label for="sel1">Project Type : </label>
            <select class="form-control" id="sel1">
                <option>Densification</option>
                <option>Renovation</option>
                <option>Expansion/Contraction of Office</option>
                <option>Infrastructure Upgrades</option>
                <option>Existing Office Relocation</option>
                <option>New Location</option>
            </select>
    Expected Start Date :
    <input type="date" name="start_date"><br>
    Expected End Date :
    <input type="date" name="end_date"><br>
    Brief description of scope of work:
    <input type="text" name="description"><br>
    Project manager :
    <input type="text" name="manager"><br>
    Project Owner :
    <input type="text" name="owner"><br>
    Project Sponser :
    <input type="text" name="sponser"><br>
    Functional Currency :
    <input type="text" name="currency"><br>
    <input type="submit" value="Submit" class = "btn btn-primary">
</form>
</div>
</body>
</html>

我想传递我查询到的值以查看用作项目类型选择的下拉淹没，如果你们知道解决方案，请告诉我。我对 es5 或 es6 完全陌生，并且很难使用语法。我还想查询其他表格以填充更多下拉菜单。

数据库是 ms sql server，我使用 mssql 模块连接数据库

提前致谢。

【问题讨论】：

看看这个答案，了解如何将变量传递给 ejs 模板：stackoverflow.com/a/16098699/2027146
然后这个答案是关于如何在 ejs 中使用循环输出你的 select options: stackoverflow.com/a/22952940/2027146
所以我应该创建一个 json 然后将它传递给我的视图？

标签： node.js express

【解决方案1】：

将数据库结果传递给模板：

router.get('/', function(req, res, next) {
    sql.connect(config).then(() => {
        return sql.query`select Project_Type_Desc from Project_Type`
    }).then(result => {
        console.log(result)
        // Pass the DB result to the template
        res.render('newProject', {dropdownVals: result})
    }).catch(err => {
        console.log(err)
    })
});

然后在你的模板中，使用传入的值：

<select class="form-control" id="sel1">
<% for(var i=0; i < dropdownVals.length; i++) { %>
   <option><%= dropdownVals[i] %></option>
<% } %>
</select>

【讨论】：

你知道如何查询另外 2 个表并传递这些值吗？已经为此苦苦挣扎了 2 天
@SSS 如果对您有用，请接受答案。如果要传递多个列表，可以进行多次数据库调用，并将结果作为传递给res.render的对象中的不同字段传递给@