简体   繁体   English

如何从 ejs 模板到服务器端节点获取在下拉菜单中选择的值

[英]how to get value selected in dropdown menu from ejs template to server side node

What I want to do is to let the user select monthyear ie something like feb2017 from a drop down menu and then get the value selected in to server side, where I'll be using the selection to search database where month_year = feb2017, month_year is a column in my database table.我想要做的是让用户从下拉菜单中选择月年,即类似 feb2017 的东西,然后将选择的值发送到服务器端,在那里我将使用选择来搜索数据库,其中 month_year = feb2017, month_year 是我的数据库表中的一列。

But, for now I just want to get the option selected to the server side.但是,现在我只想将选项选择到服务器端。 I am using node js , express as well as body parser.我正在使用 node js、express 和 body 解析器。

so, how do I go about it?那么,我该怎么做呢?

here's my ejs file这是我的 ejs 文件

<!DOCTYPE HTML>
<html>
<head>
    <title>Add/Edit DA</title>

    <link rel="stylesheet" href="style.css">
</head>
<body>
    <% var rows %>
    <% var rowsLength = rows.length %>


<div>
    <form id="tableForm" action="/salary-sheet" method="post">
    <select class="selectpicker" data-style="btn-info" name="selectpicker">
        <optgroup label="Select Table">
            <option name="" value="0">Select Month Year</option>
            <% for(var i=0;i<rowsLength;i++){ %>
            <% if(i>0){ %>
            <% if(rows[i].month_year !== rows[i-1].month_year){ %>
            <option name="table<%=i %>"  value="month1"><%= rows[i].month_year %></option>
            <% } %>

            <% }else{ %>
            <option name="table<%=i %>"  value="month2"> <%= rows[i].month_year %></option>
            <% } %>
            <% } %>
        </optgroup>
    </select>
    <input type="submit" />
</form>
    Go back to home page - <a href="/">click here</a>
</div>


</body>


</html>

and here's the related server side.这是相关的服务器端。

app.get('/select-month',function(req,res){
    connection.query('SELECT month_year FROM attendance_details',function(err,rows){
        if(err){
            throw err;
        }else{

            var rowsLength = rows.length;
            console.log('rows is ',rows);

            res.render('select-month.ejs',{rows:rows});
        }
    });


});

app.post('/salary-sheet',function(req,res){
    var month = req.body.table8;
    console.log('month is ',month);
    res.send(month);
});

would love to know how to get the option selected from ejs to server side很想知道如何从 ejs 中选择选项到服务器端

First, assuming you want to have distinct month_year values in rows (CMIIW), I'd suggest you to change the SQL query to reduce complexity in the view:首先,假设您希望rows (CMIIW) 中有不同的month_year值,我建议您更改 SQL 查询以降低视图中的复杂性:

SELECT DISTINCT month_year FROM attendance_details ORDER BY month_year ASC

Then you can use this to generate your form:然后您可以使用它来生成您的表单:

<form id="tableForm" action="/salary-sheet" method="post">
    <select class="selectpicker" data-style="btn-info" name="selectpicker">
        <optgroup label="Select Table">
            <option value="">Select Month Year</option>
            <% rows.forEach(function(row){ %>
            <option value="<%= row %>"><%= row %></option>
            <% }) %>
        </optgroup>
    </select>
    <input type="submit" value="Submit" />
</form>

and process it in the server side:并在服务器端处理:

var express = require('express'),
    bodyParser = require('body-parser'),
    app = express()

app.set('view engine', 'ejs')
app.use(bodyParser.urlencoded({
  extended: true
}))

app.post('/salary-sheet',function(req,res){
    var month = req.body.selectpicker
    console.log('month is', month)
    res.send(month)
})

app.listen(5000)

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM