将值从db传递到下拉菜单

时间:2017-08-02 20:07:19

标签: node.js express

我正在尝试从我的数据库中传递值,以便在我的视图中下拉: 这是我项目中的一个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完全不熟悉,并且在语法方面遇到了困难。我还想查询附加表以填充更多下拉列表。

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

提前致谢。

1 个答案:

答案 0 :(得分:3)

将DB结果传递给模板:

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>