The function I have written works fine and the value correctly writes to my terminal onSubmit, however I'm struggling to piece together why this code isn't updating my html.

router.post('/index', function(req, res, next) {

  // ...Get form values, do calculations to get toCost value.

      console.log('$' + toCost);

      $(document).ready(function() {
        var output = document.getElementById('cost');
        output.innerHTML = toCost;
      });

  res.location('/');
  res.redirect('/');
})

I receive the following error and jquery is loading fine.

$ is not defined

Admittedly this is an over-engineered node/express app. The code snippet lives wrapped in a route file, inside a post request.

How do I get my value onto the html?

Jade layout

extends layout

block content
  form(...)
  div#cost

The function I have written works fine and the value correctly writes to my terminal onSubmit, however I'm struggling to piece together why this code isn't updating my html.

router.post('/index', function(req, res, next) {

  // ...Get form values, do calculations to get toCost value.

      console.log('$' + toCost);

      $(document).ready(function() {
        var output = document.getElementById('cost');
        output.innerHTML = toCost;
      });

  res.location('/');
  res.redirect('/');
})

I receive the following error and jquery is loading fine.

$ is not defined

Admittedly this is an over-engineered node/express app. The code snippet lives wrapped in a route file, inside a post request.

How do I get my value onto the html?

Jade layout

extends layout

block content
  form(...)
  div#cost

• javascript
• jquery
• node.js
• express

• 2 document ready in Node.JS? I don't know much about NodeJS, but is it correct? There is no document in NodeJS... – Yeldar Kurmangaliyev Commented Dec 24, 2015 at 13:13
• Something strange is going on here? One can actually import jQuery into Node, but one can't use it like that, there's is no DOM to work with, so this seems just crazy? – adeneo Commented Dec 24, 2015 at 13:14
• Works fine for me as long as toCost is defined – Andrew Bone Commented Dec 24, 2015 at 13:15
• i use this and it's pretty cool github./bahmutov/console-log-div – AshBringer Commented Dec 24, 2015 at 13:15
• I think maybe just res.send(toCost) is what you really want – adeneo Commented Dec 24, 2015 at 13:16

4 Answers 4

The normal way to do this would be as follows:

router.post('/index', function(req, res) {   <<< 'next' removed (only needed if using middleware)

  // ...Get form values, do calculations to get toCost value.

  console.log('$' + toCost);

  res.render('indexTemplate', {cost: toCost}); <<< pass toCost through to jade as 'cost'
});

Then in your jade file for the indexTemplate you can reference the 'cost' variable passed in like this:

indexTemplate.jade:

extends layout

block content
  form(...)
  div#cost #{cost} <<< adds the cost variable to page

Then the value of toCost will appear in the resulting page.

No jQuery is required on the server side.

jQuery is made for DOM manipulations and there's no DOM on a server. Try using 'jsdom'. jQuery is made for client side scripting, not for server-side client manipulations.

It seems that you're trying to make changes on client-side from your backend. It doesn't work that way.

You could create a variable on backend for storing calculation result. And get this value by get query from client-side

You're tring to reach DOM (that is on client side) from NodeJS on a server side. It doesn't work that way.