草庐IT

javascript - 提交 POST 并在 Nodejs/EJS 中处理结果

coder 2023-11-03 原文

我有一个索引站点 (EJS),可将数组读入选择表单。

索引.ejs

<html>
  <head>
  </head>
 <body>
    <center>        
        <form action="/dates" method="POST">
            <b>INDEX:</b>
                <select id="index" name="index" onchange="this.form.submit()">
                    <option id="0"> Please choose Index </option>
                    <% collectionnames.map(item=> { %>
                    <option id="<%= item._id%>"> <%= item %> </option>
                    <% }) %>
                    </select>
                <br>
        </form>
 </body>
</html>

选择索引后,它会将索引值发布到 app.js 中的/dates

app.js

var express = require('express');
var MongoClient = require('mongodb').MongoClient;
var app = express();
var bodyParser = require('body-parser');

    app.set('view engine', 'ejs');
    app.use(bodyParser.urlencoded({ extended: false }));
    app.use( bodyParser.json() );
    app.use(express.static('public'));

app.get('/', function(req, res) {
var collectionnames = [];
MongoClient.connect('mongodb://localhost:27017', { useNewUrlParser: true   }, function (err, client) {
        if (err) {
            console.log("Error");
        } else {
            console.log("Connected to MongoDB to get collections...");
        }
var db = client.db('my-mongodb');
    db.listCollections().toArray(function (err,collections) {
            collections.forEach(function(collection){       
                    var elem = new Object();
                    if (collection.name !== "system.indexes"){
                    //console.log(collection.name);
                    elem = collection.name;
                    collectionnames.push(elem);
                    };
                });
                console.log("got collections...")
                res.render('index.ejs' , { collectionnames: collectionnames } );
            });
        });
    });


            app.post('/dates', function (req, res) {
                  const postBody = req.body;
                  index = postBody.index;
                  var dates = [];
                    MongoClient.connect('mongodb://localhost:27017', { useNewUrlParser: true }, function (err, client) {
                        if (err) {
                            console.log("Error");
                        } else {
                            console.log("Connected to fetch results");
                        }
                        var db = client.db('my-mongodb');
                        db.collection (postBody.index, function(err, values){
                            values.find().sort({VALUETIME:+1}).toArray( function (err,results){
                                results.forEach(function(result){       
                                    dates.push(result.VALUEDATE);
                                    //console.log(elem)
                                });
                                console.log("got results...")
                                function onlyUnique(value, index, self) { 
                                    return self.indexOf(value) === index;
                                }
                                var unique = dates.filter( onlyUnique );
                                console.log(unique);
                                res.send(unique);
                        });
                    });
                });
            });

我怎样才能将数组“唯一”传递回我的 index.ejs 以在另一个选择表单中处理它?现在发生的事情(使用 res.send(unique))是我在浏览器中收到一个包含数组值的列表:

0   "2018-09-01"
1   "2018-09-02"
2   "2018-09-05"
3   "2018-09-03"
4   "2018-09-04"
5   "2018-08-31"

更具体:如何将数组/值检索回我的 index.ejs 并对其进行处理?

谢谢。

最佳答案

您可以在 collectionnames 上使用 for 循环,例如:

//Assuming your `collectionnames = ['2018-09-01', '2018-09-02', '2018-09-03', '2018-09-04']`

<select id="selectId">
    <option value="">Select</option>
    <% if (collectionnames.length) { %>
        <% for (var i = 0; i < collectionnames.length; i++) { %>
            <option value="<%=collectionnames[i]%>"><%=collectionnames[i] %> </option>
        <% } %>
    <% } %>
</select>

编辑:如何将数据发送回相同的 ejs 页面?

为了使用相同的ejs 页面,您需要使用单页面应用 方法。对于单页,您需要使用 Ajax 调用而不是 form-submit 来提交数据。查看this repository以及如何实现单页应用程序的各种示例。

此外,如果您不想进入单页应用程序,只需更改您的 api 响应,使用新数据呈现同一页面:

app.post('/dates', function (req, res) {
    const postBody = req.body;
    index = postBody.index;
    var dates = [];
    MongoClient.connect('mongodb://localhost:27017', { useNewUrlParser: true }, function (err, client) {
        if (err) {
            console.log("Error");
        } else {
            console.log("Connected to fetch results");
        }
        var db = client.db('my-mongodb');
        db.collection (postBody.index, function(err, values){
            values.find().sort({VALUETIME:+1}).toArray( function (err,results){
                results.forEach(function(result){       
                    dates.push(result.VALUEDATE);
                    //console.log(elem)
                });
                console.log("got results...")
                function onlyUnique(value, index, self) { 
                    return self.indexOf(value) === index;
                }
                var unique = dates.filter( onlyUnique );
                console.log(unique);

                // Change here
                res.render('index.ejs' , { collectionnames: unique });
        });
    });
});
}); 

关于javascript - 提交 POST 并在 Nodejs/EJS 中处理结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52186895/

有关javascript - 提交 POST 并在 Nodejs/EJS 中处理结果的更多相关文章

  1. ruby - 如何指定 Rack 处理程序 - 2

    Rackup通过Rack的默认处理程序成功运行任何Rack应用程序。例如:classRackAppdefcall(environment)['200',{'Content-Type'=>'text/html'},["Helloworld"]]endendrunRackApp.new但是当最后一行更改为使用Rack的内置CGI处理程序时,rackup给出“NoMethodErrorat/undefinedmethod`call'fornil:NilClass”:Rack::Handler::CGI.runRackApp.newRack的其他内置处理程序也提出了同样的反对意见。例如Rack

  2. ruby - 如何模拟 Net::HTTP::Post? - 2

    是的,我知道最好使用webmock,但我想知道如何在RSpec中模拟此方法:defmethod_to_testurl=URI.parseurireq=Net::HTTP::Post.newurl.pathres=Net::HTTP.start(url.host,url.port)do|http|http.requestreq,foo:1endresend这是RSpec:let(:uri){'http://example.com'}specify'HTTPcall'dohttp=mock:httpNet::HTTP.stub!(:start).and_yieldhttphttp.shou

  3. ruby-on-rails - rails : How to make a form post to another controller action - 2

    我知道您通常应该在Rails中使用新建/创建和编辑/更新之间的链接,但我有一个情况需要其他东西。无论如何我可以实现同样的连接吗?我有一个模型表单,我希望它发布数据(类似于新View如何发布到创建操作)。这是我的表格prohibitedthisjobfrombeingsaved: 最佳答案 使用:url选项。=form_for@job,:url=>company_path,:html=>{:method=>:post/:put} 关于ruby-on-rails-rails:Howtomak

  4. ruby - 有人可以帮助解释类创建的 post_initialize 回调吗 (Sandi Metz) - 2

    我正在阅读SandiMetz的POODR,并且遇到了一个我不太了解的编码原则。这是代码:classBicycleattr_reader:size,:chain,:tire_sizedefinitialize(args={})@size=args[:size]||1@chain=args[:chain]||2@tire_size=args[:tire_size]||3post_initialize(args)endendclassMountainBike此代码将为其各自的属性输出1,2,3,4,5。我不明白的是查找方法。当一辆山地自行车被实例化时,因为它没有自己的initialize方法

  5. jquery - 我的 jquery AJAX POST 请求无需发送 Authenticity Token (Rails) - 2

    rails中是否有任何规定允许站点的所有AJAXPOST请求在没有authenticity_token的情况下通过?我有一个调用Controller方法的JqueryPOSTajax调用,但我没有在其中放置任何真实性代码,但调用成功。我的ApplicationController确实有'request_forgery_protection'并且我已经改变了config.action_controller.consider_all_requests_local在我的environments/development.rb中为false我还搜索了我的代码以确保我没有重载ajaxSend来发送

  6. ruby - 我如何添加二进制数据来遏制 POST - 2

    我正在尝试使用Curbgem执行以下POST以解析云curl-XPOST\-H"X-Parse-Application-Id:PARSE_APP_ID"\-H"X-Parse-REST-API-Key:PARSE_API_KEY"\-H"Content-Type:image/jpeg"\--data-binary'@myPicture.jpg'\https://api.parse.com/1/files/pic.jpg用这个:curl=Curl::Easy.new("https://api.parse.com/1/files/lion.jpg")curl.multipart_form_

  7. 报告回顾丨模型进化狂飙,DetectGPT能否识别最新模型生成结果? - 2

    导读语言模型给我们的生产生活带来了极大便利,但同时不少人也利用他们从事作弊工作。如何规避这些难辨真伪的文字所产生的负面影响也成为一大难题。在3月9日智源Live第33期活动「DetectGPT:判断文本是否为机器生成的工具」中,主讲人Eric为我们讲解了DetectGPT工作背后的思路——一种基于概率曲率检测的用于检测模型生成文本的工具,它可以帮助我们更好地分辨文章的来源和可信度,对保护信息真实、防止欺诈等方面具有重要意义。本次报告主要围绕其功能,实现和效果等展开。(文末点击“阅读原文”,查看活动回放。)Ericmitchell斯坦福大学计算机系四年级博士生,由ChelseaFinn和Chri

  8. git使用常见问题(提交代码,合并冲突) - 2

    文章目录git常用命令(简介,详细参数往下看)Git提交代码步骤gitpullgitstatusgitaddgitcommitgitpushgit代码冲突合并问题方法一:放弃本地代码方法二:合并代码常用命令以及详细参数gitadd将文件添加到仓库:gitdiff比较文件异同gitlog查看历史记录gitreset代码回滚版本库相关操作远程仓库相关操作分支相关操作创建分支查看分支:gitbranch合并分支:gitmerge删除分支:gitbranch-ddev查看分支合并图:gitlog–graph–pretty=oneline–abbrev-commit撤消某次提交git用户名密码相关配置g

  9. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法? - 2

    我遇到了一个非常奇怪的问题,我很难解决。在我看来,我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时,我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性,其中包括href和data-method。再次单击此链接后,我的服务器收到了对新href的请求,但使用的是旧的data-method,即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是,如果我刷新页面,HTML与"new"HTML相同(随返回的JS发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  10. Ruby-vips 图像处理库。有什么好的使用示例吗? - 2

    我对图像处理完全陌生。我对JPEG内部是什么以及它是如何工作一无所知。我想知道,是否可以在某处找到执行以下简单操作的ruby​​代码:打开jpeg文件。遍历每个像素并将其颜色设置为fx绿色。将结果写入另一个文件。我对如何使用ruby​​-vips库实现这一点特别感兴趣https://github.com/ender672/ruby-vips我的目标-学习如何使用ruby​​-vips执行基本的图像处理操作(Gamma校正、亮度、色调……)任何指向比“helloworld”更复杂的工作示例的链接——比如ruby​​-vips的github页面上的链接,我们将不胜感激!如果有ruby​​-

随机推荐