11

我正在使用 express 开发一个快速的 node.js 应用程序，我是 NODE 的新手。对于页面，我只是使用纯 html。

基本上我有一个如下表格：

 <form id="tableForm" action="getJson">
        <select class="selectpicker" data-style="btn-info" name="selectpicker">
            <optgroup label="Select Table">
              <option name="" value="0">Select table</option>
              <option name="table1" value="1">Table 1</option>
              <option name="table2" value="2">Table 2</option>
              <option name="table3" value="3">Table 3</option>
            </optgroup>
        </select>
    </form>

基本上，我需要在完成后获取选择的值，我需要将其传递给app.get()调用，但我的问题是如何获取值并调用 API？

var express = require('express'),
app = express();

app.use(express.bodyParser());
 // as only one page can use res.sendfile to render the page which will 
 // contain the dropdowns ...
 app.get('/', function(req, res){
  res.sendfile('views/index.html');
});

app.get('/getJson', function (req, res) {
   console.log(req.body.);
});

app.listen(process.env.PORT);

所以我需要调用getJson()传入的值。

干杯!

4

3 回答 3

19

您需要以某种方式提交表单。最简单的方法是使用提交按钮。您还需要为表单输入方法，按照您的措辞方式，这听起来像是您想要使用 GET。

HTML

<form id="tableForm" action="/getJson" method="get">
    <select class="selectpicker" data-style="btn-info" name="selectpicker">
        <optgroup label="Select Table">
            <option name="" value="0">Select table</option>
            <option name="table1" value="1">Table 1</option>
            <option name="table2" value="2">Table 2</option>
            <option name="table3" value="3">Table 3</option>
        </optgroup>
    </select>
    <input type="submit" />
</form>

在服务器端，您需要解析获取请求。您已经设置好接收它，您只需要知道您在寻找什么。由于您的选择具有名称“selectpicker”，这就是您将在这种情况下使用的名称。

JavaScript

var express = require('express'),
    app = express();

app.use(express.bodyParser());

// as only one page can use res.sendfile to render the page which will contain the drop   downs
app.get('/', function (req, res) {
    res.sendfile('views/index.html');
});

app.get('/getJson', function (req, res) {
    // If it's not showing up, just use req.body to see what is actually being passed.
    console.log(req.body.selectpicker);
});

app.listen(process.env.PORT);

我还没有完全测试过这段代码，但它应该可以工作。

于 2013-09-03T00:12:09.583 回答
1

您可以在选择标签内使用更改功能。

<select class="selectpicker" (ngModelChange)="changeValue($event)" data-style="btn-info" name="selectpicker">
        <optgroup label="Select Table">
          <option name="" value="0">Select table</option>
          <option name="table1" value="1">Table 1</option>
          <option name="table2" value="2">Table 2</option>
          <option name="table3" value="3">Table 3</option>
        </optgroup>
    </select>

然后在你的打字稿文件中，

  changeValue(value) {
     console.log(value);
  }
于 2018-03-23T04:53:45.273 回答
0

您可以req.query.selectpicker用于从“选择”元素中获取数据作为 URL 查询参数。这对我有用！

将方法 GET 和 action 保留为您要访问下拉数据的路由名称。

于 2020-01-13T13:22:47.477 回答