基于 HTML 选择选项执行 Node.JS 查询

Posted 2023-02-24

【中文标题】基于 HTML 选择选项执行 Node.JS 查询

【英文标题】：Perform Node.JS Query based on HTML select option

【发布时间】：2016-06-11 19:07:15

【问题描述】：

我正在尝试根据用户从我网站的选择选项中选择的内容对 mysql 数据库执行特定查询。

html：

<select id = "year">
<option value = "yr" selected>Choose a Year</option>
<option id = "2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
</select>

Node.JS：

    function handleDatabase(request,response)
     pool.getConnection(function(err, connection)
    //Check if there's an error, if so, stop connection and print error
      if(err)
        connection.release();
        response.json("code": 50, "status": "Error in connection to database");
        return;
    
    connection.query("select * from 'fifteen' where TYPE = 'Mischief'", function(err, rows)
      connection.release();
      if(!err)
        response.json(rows);
      
    );
      response.json("code": 50, "status" : "Error in connection to database");
      return;
    );
  );


app.get('/',function(request,response)
    handleDatabase(response,request);
    

AJAX：

$(document).ready(function()
    $('#year').click(function() 
            $.ajax(
                type: 'GET',
                url: 'http://localhost:8888/',
                dataType: 'json',
                success: function () 
                    console.log("Success");
                ,
                error: function (data) 
                    console.log("Error.", data);
                

            );
    );
);

我希望用户能够选择他们想要的每一年，然后在服务器上执行 AJAX 请求，然后服务器将对数据库执行查询。例如，用户选择 2014，向服务器发出 AJAX 请求，服务器随后对表 14 进行查询，并从中返回所有数据。

【参考方案1】：

一种解决方案是只对动态 url 参数使用 express 中间件：

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

router.get('/yearQuery/:year', function(req, res) 
  var year = req.params.year;

  // Your code

  res.json(//year data object);
);

Ajax 请求变为：

$.ajax(
  type: 'GET',
  url: 'http://localhost:8888/yearQuery/' + year,
  dataType: 'json',
  success: function () 
    console.log("Success");
  ,
  error: function (data) 
    console.log("Error.", data);
                

其余部分由您填写（例如年份值的文档 ID 选择器）。

【讨论】：

您能详细说明一下吗？我对这一切都非常陌生。对于您添加的路由器，这是否需要用户在 url 末尾手动输入他们想要的年份？而当你做“/yearQuery/+year”的时候，那个year变量是预定义的还是自己填写的？

用户只是从您的一个按钮或选择器中选择年份。您的代码正在创建网址。

年份变量由 url 填充。

您需要使用标准 jquery 从您的选择器中选择选定的值，从该值创建一个 VAR，将该 var 命名为年份，这就是您的 ajax url 中的年份变量。