如何从 mongodb 到 html 表单字段中获取数据？答案

【问题标题】：How to fetch data from, mongodb to html form fields?如何从 mongodb 到 html 表单字段中获取数据？
【发布时间】：2018-06-11 22:03:33
【问题描述】：

database name is test1 and collection name is feedbacks 
this is app.js

我无法在我的 html 表单字段中获取 mongodb 数据正在插入数据，但我想在我的表单中获取初始值帮助我解决这个问题。因为我是新手，所以我想有一个简单的显式解决方案。

var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');
var mongodb = require('mongodb');

var dbConn = mongodb.MongoClient.connect('mongodb://localhost:27017/test1');

var app = express();

app.use(bodyParser.urlencoded({ extended: false }));
app.use(express.static(path.resolve(__dirname, 'public')));

app.get('/retrieve', function(req, res){
    post.find({}, function(err, feedbacks){
        if(err) res.json(err);
        else    res.render('retrieve', {posts: feedbacks});
    });
});
app.post('/post-feedback', function (req, res) {
    dbConn.then(function(db) {
        delete req.body._id; // for safety reasons
        var dd = db.db("test1");

        dd.collection('feedbacks').insertOne(req.body);
    });    
    res.send('Data received:\n' + JSON.stringify(req.body));
});


app.get('/view-feedbacks',  function(req, res) {
    dbConn.then(function(db) {
        var dd=db.db("test1");
        dd.collection('feedbacks').find({"Name":"shubham"}).toArray().then(function(feedbacks) {
            res.status(200).json(feedbacks);
        });
    });
});
app.get('/view-sahil',  function(req, res) {
    dbConn.then(function(db) {
        var dd=db.db("test1");
        dd.collection('feedbacks').insertOne({"name":"sahil","E-mail":"sahil@vibhuti.guru","comment":"jhdsfji"},function(feedbacks) {
            res.status(200).json("Data inserted");
            });
        });
    });
 app.listen(process.env.PORT || 3000, process.env.IP || '0.0.0.0' );

这是我的index.html

<!doctype html>
<html lang="en">
<head>
    <script src="..app.js"></script>
    <meta charset="UTF-8">
    <title>mongodb</title>
</head>
<body>
    <h1>Please fill data in the form below:</h1>
    <form method="POST" action="/">
        <label>Name:<input type="text" name="" value= feedbacks.name required></label>
        <br>
        <label>Email:<input type="text" name="Email" value="" required></label>
        <br>
        <label>Comment:<br><textarea name="comment"></textarea></label>
        <br>
        <input type="submit" value="Submit">
    </form>


    <a href="/view-feedbacks">View Records</a>
    <a href="/view-sahil">insert dummy record </a>
</body>

</html>

【问题讨论】：

这是错误的方式<a href="/view-feedbacks">View Records</a> 这里<a href="/view-feedbacks">View Records</a> 是REST api 所以在AJAX 的帮助下调用这个api
@ManjeetThakur 先生，您能详细说明一下这个答案吗？我是新手，对此我没有太多了解。如果可能的话，请给我写完整的代码，我将不胜感激
你使用的是哪个框架？
@manjeet thakur nodejs 和 angularjs

标签： javascript html node.js mongodb

【解决方案1】：

你可以像这样从 angularjs 调用 API

var testApp = angular.module('testApp', []);

testApp.controller('testController' , function ($scope, $http) {

    $scope.getRequest = function () {
        console.log("I've been pressed!");  
        $http.get("http://localhost/view-feedbacks")
            .then(function successCallback(response){
                $scope.response = response;
                // Print this value in html 
            }, function errorCallback(response){
                console.log("Unable to perform get request");
            });
    };

});

使用 jQuery，你可以这样做

 $.ajax({  
       type: "GET",  
       url: "http://localhost/view-feedbacks",  
       dataType: "json",  
       success: function(resp){  

         console.log("resp", resp);  
       },  
       error: function(e){  
         alert('error', e);  
       }  
     });

【讨论】：

先生，我必须使用nodejs文件和html然后如何使用ajax
什么都没有发生先生。谢谢你我感谢你的努力
这很有帮助，先生