title: How to submit a form using JS, Node, Mongo, and Express?
body: <p>I am a beginner programmer. I am wondering how to submit a form, composed of JQuery date picker and radio buttons, using a button. I want to submit the form to a Mongo Database called <code>test</code>. In my <code>home.html</code> file I call the different stylesheets and javascript files I need. Then I set up an input field in the <code>home.html</code> and a button beneath the form to submit:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
   &lt;head&gt;
     &lt;meta name="viewport" content="initial-scale=1.0, user-scalable=no"&gt;
     &lt;meta charset="utf-8"&gt;
  
     &lt;title&gt;Home&lt;/title&gt;
     &lt;!-- Local CSS and JS --&gt;
     &lt;script src="/javascripts/home.js"&gt;&lt;/script&gt;
  
     &lt;!-- Materialize: Compiled and minified CSS --&gt;
     &lt;link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.min.css"&gt;
  
     &lt;!-- Materialize: Compiled and minified JavaScript --&gt;
     &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/js/materialize.min.js"&gt;&lt;/script&gt;
   &lt;/head&gt;
   &lt;body&gt;
       &lt;!-- Input field I want to submit --&gt;
       &lt;form method="post" action="/submit"&gt;
           &lt;input id="test1" type="radio"&gt;&lt;label for="test1"&gt;Test&lt;/label&gt;
           &lt;input id="test2" type="radio"&gt;&lt;label for="test2"&gt;Test 2&lt;/label&gt;
           &lt;input id="test3" type="radio"&gt;&lt;label for="test3"&gt;Test 3&lt;/label&gt;
       &lt;/form&gt;
       &lt;!-- Button I want to use to submit --&gt;
       &lt;button type="submit" class="btn waves-effect waves-light" name="action"&gt;Sumbit&lt;/button&gt;
       &lt;/div&gt;
   &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Right now, I am loading this file by typing in localhost:3000/home.html. I want to use my <code>index.js</code> file to write the post method for submitting the data to my DB called <code>test</code>. After doing some research, I found that I'll need something to start my <code>index.js</code> like:</p>
  
  <pre><code>var express = require('express');
  var router = express.Router();
  
  //TALKING TO THE DB?
  var MongoClient = require('mongodb').MongoClient;
  var assert = require('assert')
  var ObjectId = require('mongodb').ObjectID;
  var url = 'mongodb://localhost:27017/test';
  var bodyParser = require('body-parser');
  /*something would follow like?:
  router.get('/submit', function(req, res) {
      var db = req.test;
  });*/
  </code></pre>
  
  <p>For reference, I'm using the express skeleton so my <code>app.js</code> looks like:</p>
  
  <pre><code>var express = require('express');
  var path = require('path');
  var favicon = require('serve-favicon');
  var logger = require('morgan');
  var cookieParser = require('cookie-parser');
  var bodyParser = require('body-parser');
  
  // Database
  var mongo = require('mongodb');
  var monk = require('monk');
  
  //DB TEST
  var db = monk('localhost:27017/test');
  
  var routes = require('./routes/index');
  
  var app = express();
  
  // view engine setup
  app.set('views', path.join(__dirname, 'views'));
  app.set('view engine', 'jade');
  
  // uncomment after placing your favicon in /public
  app.use(logger('dev'));
  app.use(bodyParser.json());
  app.use(bodyParser.urlencoded({ extended: false }));
  app.use(cookieParser());
  app.use(express.static(path.join(__dirname, 'public')));
  
  
  // catch 404 and forward to error handler
  app.use(function(req, res, next) {
    var err = new Error('Not Found');
    err.status = 404;
    next(err);
  });
  
  // error handlers
  
  // development error handler
  // will print stacktrace
  if (app.get('env') === 'development') {
    app.use(function(err, req, res, next) {
      res.status(err.status || 500);
      res.render('error', {
        message: err.message,
        error: err
      });
    });
  }
  
  // production error handler
  // no stacktraces leaked to user
  app.use(function(err, req, res, next) {
    res.status(err.status || 500);
    res.render('error', {
      message: err.message,
      error: {}
    });
  });
  
  
  module.exports = app;
  </code></pre>
  
  <p>However, I am confused as to how to set up routes that grabs the data from my input fields (using the submit button). Then I want to use a post method to write that information to my <code>test</code> database. Any help would be greatly appreciated! Thank you!</p>