How to get the value of selected option in html using find() in Node.js Express and mongodb

I’m trying to get a specific document in mongodb and I’m using find(). the problem is that it doesn’t give me the result that I’m looking for in the html file (for example: i choose MALE and XL which I know I have in my database). what I get is:

 Connected successfully to server

 { _id: 5df3c05bdfcdbd13d89d7c91,
 'D_id': '',
 name: null,
 gender: null,
 breed: null,
 size: null,
 age: null,
 location: null }
 DONE

*I have that kind of null document, but it’s not what I asked for.

The HTML file:

     <html>
     <head>
     </script>
     </head>
     <body>
     <link rel ="stylesheet" type='text/css' href='form.css'>

     <div class="form">

     <form method="POST" action="http://localhost:8080" style="text-align:center">

    <label>Gender:</label><br>
        <select>
        <option name="g_gender" value="MALE">MALE</option>
        <option name="g_gender" value="FEMALE">FEMALE</option>
        </select>   <br><br> 

      <label>size:</label><br>
      <select>
        <option name="g_size" value="XS"> XS</option>
        <option name="g_size" value="S"> S</option>
        <option name="g_size" value="M"> M</option>
        <option name="g_size" value="L"> L</option>
        <option name="g_size" value="XL"> XL<br><br>
      </select> <br><br>


    <br><button type="submit" class="button" value="Reset">RESET</button>
        <button type="submit" class="button" value="Submit">SEARCH</button>
 </form>
 </div>
 </body> 
 </html>

The node.js file:

   var express = require('express');
   const bodyParser= require('body-parser');
   const MongoClient = require('mongodb').MongoClient;
   const mongo_url = 'mongodb://localhost:27017';
   const http = require('http');
   const assert = require('assert');
   const qstring=require('querystring');
   var app = express();

   app.use(bodyParser.urlencoded({extended: true}))

   app.get('/', (req, res) => {
    res.sendFile(__dirname + '/form.html');
  })

   http.createServer(function (req, res) {
    if (req.method == "POST"){
     var reqData = '';
     req.on('data', function (chunk) {
     reqData += chunk;
   });
    req.on('end', function() {
    var postParams = qstring.parse(reqData);
    getDogsData(postParams.g_gender,postParams.g_size,res);

     });

   function getDogsData(g_gender,g_size,res){

   MongoClient.connect(mongo_url,{ useUnifiedTopology: true },function(err,client) {
   assert.equal(null, err);
   console.log("Connected successfully to server");

   var database = client.db('Dogs'); 
   const coll = database.collection('adptdog');

   const cursor = coll.find({gender:g_gender,size:g_size});
   cursor.forEach(function(doc) {
      res.write(JSON.stringify(doc));
      console.log(doc);
    },function(err) {
      console.log("DONE");
      client.close();
   });
  });
  }

  }}).listen(8080);

Answer

    HTML code:
we have to add id and name into select tag then you can fetch value into the server-side.
    <div class="form">

         <form method="POST" action="http://localhost:8080" style="text-align:center">



        <label>Gender:</label><br>

            <select name="g_gender" id="g_gender">

            <option name="g_gender" value="MALE">MALE</option>
            <option name="g_gender" value="FEMALE">FEMALE</option>
            </select>   <br><br> 

          <label>size:</label><br>

          <select name="g_size" id="g_size">
            <option name="g_size"  value="XS"> XS</option>
            <option name="g_size"  value="S"> S</option>

            <option name="g_size" value="M"> M</option>
            <option name="g_size" value="L"> L</option>
            <option name="g_size" value="XL"> XL<br><br>
          </select> <br><br>


        <br><button type="submit" class="button" value="Reset">RESET</button>
            <button type="submit" class="button" value="Submit">SEARCH</button>
     </form>
     </div>

    you will request data into req.body.

    node.js file:
    var express = require('express');
       const bodyParser= require('body-parser');
       const MongoClient = require('mongodb').MongoClient;
       const mongo_url = 'mongodb://localhost:27017';
       const http = require('http');
       const assert = require('assert');
       const qstring=require('querystring');
       var app = express();

       app.use(bodyParser.urlencoded({extended: true}))

       app.get('/', (req, res) => {
        res.sendFile(__dirname + '/form.html');
      })

       http.createServer(function (req, res) {
if (req.method == "POST"){
        let body=req.body;
        getDogsData(body.g_gender,body.g_size,res);

       function getDogsData(g_gender,g_size,res){

       MongoClient.connect(mongo_url,{ useUnifiedTopology: true },function(err,client) {
       assert.equal(null, err);
       console.log("Connected successfully to server");

       var database = client.db('Dogs'); 
       const coll = database.collection('adptdog');

       const cursor = coll.find({gender:g_gender,size:g_size});
       cursor.forEach(function(doc) {
          res.write(JSON.stringify(doc));
          console.log(doc);
        },function(err) {
          console.log("DONE");
          client.close();
       });
      });
      }

      }}).listen(8080);

Advertisement

Answer