Question

0

68

Vistas

How to send mongodb results and html page in a get request?

I have a form in a html page, when the form is submitted, I would like a new html page to be served, a mongo database queried, the results sent to the new page and rendered by the client. How can I do this with a get request in Node?

index.html

<form action="dbQuery/formOne" id="form1" method="GET">
   <input type="checkbox" id="australia" name="options" value="AUS">
   <label for="optionOne">Australia</label>
   <input type="checkbox" id="america" name="options" value="USA">
   <label for="america">U.S.A.</label>
   <button type="submit" class="btn" for="form1" >Next</button>
</form>

Node

const express = require('express');
const bodyParser =  require('body-parser')
const mongoose = require('mongoose')
const app = express();
absolutePath = __dirname + '/views/index.html' 

mongoose.connect('mongodb+srv://user:password@cluster0.xxxxx.mongodb.net/database')
let db = mongoose.connection;
//check connection
db.once('open', ()=>{
    console.log('Connected')
})

//MIDDLEWARE
app.use(bodyParser.urlencoded({extended:false}));
app.use(bodyParser.json());
app.use(express.static(__dirname + '/public'));

//ROUTES
dbQuery = require('./routes/dbQuery')
app.use('/dbQuery', dbQuery)

//Main pages
app.get('/', function(req, res, next){
    res.sendFile(absolutePath)
});

app.listen(process.env.port || 5000, function(){
    console.log("Listening on port 5000")
});

Router file

const express = require('express');
const router = express.Router();
const bodyParser =  require('body-parser')
const mongoose = require('mongoose')
const path = require('path')
let db = mongoose.connection;

router.get('/formOne', function(req,res, next){
    let query = { Country: req.query.options };
    result = db.collection('countries').find(query)
    res.sendFile(path.resolve('views/countryView.html'))
   }
   
module.exports = router;

What I want to do is get the result object from the get request, pass it into a javascript function on the countryView.html page and let that function render the results, but I am having trouble accessing that result object on the new countryView page.

I am aware there is a possibility of doing this with pug, and rendering it on the server, but I would like to do it on the client

7 months ago · Juan Pablo Isaza

1 Respuestas

Responde la pregunta

0

Responde la pregunta

Encuentra empleos remotos

Answer 1 · 2022-07-01T01:06:07.840Z

You can pass your data as JSON through a route (/data), and in your HTML file get the data by using AJAX.

router.get('/data', function(req,res){
let result= { "country" : "value" }; // your data from DB
res.json(JSON.parse(result));
}

and in your HTML:

let ajax = new XMLHttpRequest();
ajax.open('get','localhost:5000/data');

ajax.onreadystatechange = function(){
    if(this.readyState == XMLHttpRequest.DONE){
        if(this.status == 200){
            console.log(JSON.parse(ajax.responseText));
        }else{
            console.log(ajax.status);
        }
    }
}

ajax.send();