title: Unable to render JSON in html - node.js
body: <p>This is probably a simple solution, however I cannot figure out how to carry my JSON object over to my view. Normally you'd throw JSON into res.render() inside your app.get .. unfortunately I am having trouble. A problem arises because i need to be able to send form data from html to my API request, then grab that JSON object and display it in my view. I can see it in my console, but unable to carry it over to html. Would love some help or guidance on how to improve my code or find a solution. Any help is appreciated! - View code below:</p>
  
  <p>Server.js</p>
  
  <pre><code>var path = require('path');
  var express = require('express');
  var exphbs  = require('express-handlebars');
  var bodyParser = require('body-parser');
  var Bls2 = require('bls2');
  
  var app = express();
  
  app.engine('html', exphbs({ extname: '.html' }));
  app.set('view engine', 'html');
  app.use(bodyParser.json());
  app.use(bodyParser.urlencoded({ extended: true }));
  
  var blsRequest = function(req, res, inputContent){
      const API_KEY = //bls API key here
      let bls = new Bls2(API_KEY);
      console.log('this is seriesID =', inputContent);
  
      let options = {
          'seriesid': [inputContent],
          'startyear': '2008',  
          'endyear': '2018',
          // ...
      };
  
      bls.fetch(options).then(function (response) {
          var data = JSON.stringify(response)
          console.log(data);
          console.log('API Call Complete')
  
          res.send({data : data}); //need to render home view and JSON HERE
      });
  }
  
  app.get('/', function (req, res) {
  
      res.render('home');
  });
  
  app.post('/', function(req, res){
      let inputContent = req.body.seriesID;
      blsRequest(req, res, inputContent);
  
  });
  
  app.listen(8000);
  </code></pre>
  
  <p>html</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;LBS&lt;/title&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="crossorigin="anonymous"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div class="container-fluid"&gt;
          &lt;form id="seriesID"&gt;
              &lt;div class="form-group" method="post" action='/'&gt;
                  &lt;label for="seriesID"&gt;Input Series ID&lt;/label&gt;
                  &lt;input type="text" class="form-control" name="seriesID" placeholder="Series ID"&gt;
              &lt;/div&gt;
              &lt;button class="btn btn-primary" type="submit"  &gt;Search&lt;/button&gt;
          &lt;/form&gt;&lt;br&gt;
  
          uhh JSON should be here: {{data}}
      &lt;/div&gt;
  &lt;/body&gt;
      &lt;script type="text/javascript"&gt;
          $("#seriesID").submit(function (event) {
              $.post('/', $("#seriesID").serialize(), function (data) {
                   //data is the response from the backend
              });
              event.preventDefault();
          });
      &lt;/script&gt;
  &lt;/html&gt;
  </code></pre>