Tengo un formulario en una página html, cuando se envía el formulario, me gustaría que se sirva una nueva página html, se consulte una base de datos mongo, los resultados se envíen a la nueva página y los procese el cliente. ¿Cómo puedo hacer esto con una solicitud de obtención en Node?
índice.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">USA</label> <button type="submit" class="btn" for="form1" >Next</button> </form>
Nodo
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") });
Archivo de enrutador
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;
Lo que quiero hacer es obtener el objeto de resultado de la solicitud de obtención, pasarlo a una función javascript en la página countryView.html y dejar que esa función genere los resultados, pero tengo problemas para acceder a ese objeto de resultado en la nueva página de countryView.
Soy consciente de que existe la posibilidad de hacer esto con pug y renderizarlo en el servidor, pero me gustaría hacerlo en el cliente
Puede pasar sus datos como JSON a través de una ruta (/ datos), y en su archivo HTML obtener los datos usando AJAX.
router.get('/data', function(req,res){ let result= { "country" : "value" }; // your data from DB res.json(JSON.parse(result)); }
y en tu 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();