I am using express.js and jQuery to create a basic upvote downvote program. Basically the voting buttons increment/decrement by one whenever pressed and the result of each button click is displayed below. Nothing happens when the buttons are clicked, not even a Cannot POST /. I am not sure what is causing the error. This is what my main.js file looks like:
$(document).ready(function(){
$("#up").click(function(){
var up = $.post("/upvote", {changeBy: 1}, function(dataBack){
$("#upvote").text(dataBack);
});
});
$("#down").click(function(){
var down = $.post("/downvote", {changeBy: 1},
function(dataBack){
$("#downvote").text(dataBack);
});
});
});
and then on the server side server.js, I have this:
var express = require("express");
var app = express();
var bodyParser = require("body-parser");
app.use(bodyParser.urlencoded({extended: true}));
app.use(express.static("public"));
var inc = 0;
var dec = 0;
app.post("/upvote", function(req, res){
res.setHeader("Content-Type", "application/json");
inc += parseFloat(req.body.changeBy);
res.write(JSON.stringify(inc));
res.end();
});
app.post("/downvote", function(req, res){
res.setHeader("Content-Type", "application/json");
dec -= parseFloat(req.body.changeBy);
res.write(JSON.stringify(dec));
res.end();
});
var server = app.listen(8081, function () {
var host = server.address().address
var port = server.address().port
console.log("Example app listening at http://%s:%s", host, port)
})
A bit of HTML:
<div class="buttons">
<button id="down">Downvote</button>
<p id="downvote"></p>
<button id="up">Upvote</button>
<p id="upvote"></p>
</div>