'I'm trying to perform a calculation, return the result and render it in the same page in node.js can't figure out the last part

So I'm trying to perform a calculation on node js and then render the result in

in the main HTML but I can't figure out how. Everything else is working and done I'm just missing the last part. Any ideas? First step of task End product of task

JS File:

const express = require ("express");
const bodyParser = require ("body-parser");


const app = express();
app.use(bodyParser.urlencoded({extended: true}))

app.use(express.static('public'));//to use css 

app.get("/", function(req, res){
    res.sendFile(__dirname + "/bmi.html");

});

app.post("/", function(req, res){
var weight = parseFloat(req.body.weight);
var height = parseFloat(req.body.height);

    var bmi = weight / Math.pow(height/100, 2);

res.send("Your BMI Result is: " + bmi.toFixed(2));

});

app.listen(3000,function(){
     console.log("Server running on port 3000");
});

HTML File: 

<head>
    <link rel="stylesheet" type="text/css" href="/CSS/bmi.css">
    <link href="https://fonts.googleapis.com/css?family=Noto+Sans" rel="stylesheet">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>BMI checker</title>
</head>

<body>
    <div class="header">
        <div class="wrapper">
           <form action="/" method="post">
             <h1>BMI calculator</h1>
             <p>Insert Your Age</p>
             <input type="number" id="age">
             <p>Insert Weight in Kg</p>
             <input type="number" name="weight" id="weight">
             <br>
             <p>Insert Height in cm</p>
             <input type="number" name="height" id="height">
             <br>
             <button type="submit" id="calc">check</button>
             <p id="result"></p>
           </form>
         </div>
     </div>

  </body>
  </html>
javascripthtmlnode.jsajax


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions