时间戳

首页 > 解决方案 > 从下拉列表Nodejs中选择的值查询数据库

mysql - 从下拉列表Nodejs中选择的值查询数据库

问题描述

我已经开始使用 nodejs 并尝试制作一个包含两个下拉列表的网站。其中选择的值必须作为参数传递给 MySQL 过程（然后是要在网页上显示的表格）。

到目前为止，我已经能够（通过改编其他人的代码）在网页上显示表格，而无需使用下拉列表，即手动输入参数users.js。

因此，问题是从下拉列表中获取两个值，然后我将在查询中使用占位符将它们用作参数。任何帮助和建议表示赞赏。这是我的项目文件夹树。

在此处输入图像描述

users.js

var express = require('express');
var router = express.Router();
var db = require('../database');

router.get('/user-list', function(req, res, next) {
    db.query("TRUNCATE stack_Compare");
    db.query("SET max_sp_recursion_depth=100");
    db.query("CALL insertMain(?,?)");                   //here I manually type arguments but want to actually get them from drop down lists.

    var sql="SELECT * FROM stack_Compare";
    db.query(sql, function (err, results, fields) {
        if (err) throw err;
        res.render('user-list', { title: 'User List', userData: results});
  });
});


module.exports = router;

表格代码在user-list.ejs

<form action="/users/input" method="POST">
          <fieldset style="width:50%">
          <select class="selectpicker" data-style="btn-info" name="selectpicker">
            <optgroup label="Select Table">
                <option name="" value="0">Starting Station</option>
                <option name="table1" value="1">A</option>
                <option name="table2" value="2">B</option>
                <option name="table3" value="3">C</option>
            </optgroup>
        </select>
       to
       <select class="selectpicker" data-style="btn-info" name="selectpicker">
        <optgroup label="Select Table">
            <option name="" value="0">Destination Station</option>
            <option name="table1" value="1">S</option>
            <option name="table2" value="2">O</option>
            <option name="table3" value="3">G</option>
        </optgroup>
    </select>
    <button class="dropbtn"><b>GO</b></button>

      </fieldset>
         </form>

我曾考虑在其中添加以下代码，users.js但对于他们应该如何从表单中选择不同的数据感到困惑。

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

// this script to fetch data from drop-down lists
router.post('/input', function(req, res, next) 
    
})

标签： mysqlnode.jsexpressdrop-down-menu

解决方案

所以 Express 提供了一个中间件，它将处理请求编码的形式，并将所有信息放入您在处理程序函数中收到的请求正文对象中。

您所要做的就是添加这个中间件行：

app.use(
  express.urlencoded({
    extended: true
  })
);

然后您可以使用请求对象访问所有表单值。像这样：

app.post("/submit-form", (req, res) => {
  const formvalues = req.body;
  const valueSelected = req.body.selectpicker
  //process your data
  res.status(200).send('Processed');
});

问题是 express 中间件会发挥作用。我建议您为下拉菜单使用不同的名称。

推荐阅读