Ive achieved a retrieve via http://localhost:3000/update2?buyerID=2299 which fetch the particular document.
When i press submit it redirects to the /orders page from where i can view all the records and there current fields.
If i change one the fields in retrieve and click submit it doesn't update the document Its the same as before.
1 of 5 JSON Documents- http://prntscr.com/dilrb0
JS FILE
router.get('/update2', function(req, res) {
var buyerID = req.query.buyerID;
if (!buyerID || !parseInt(buyerID)) {
res.render('error', {message: "You need to enter an ID to update a specific order", error:{status:"", stack: ""}});
} else {
mongoClient.connect(url, function (err, db) {
if (err) {
res.render('error', {message: "Failed to connect to MongoDB",error:{status:"", stack: ""}});
} else {
var WishList = db.collection('orders');
WishList.findOne({"buyerID": parseInt(buyerID)}, function(err, result) {
if (err || !result || result.length == 0) {
res.render('error', {message: "Failed to find order",error:{status:"", stack: ""}});
} else {
res.render('updateOrder2', {qs: result});
}
})
}
});
}
});
router.post('/update2', function(req, res) {
var buyerID = req.query.buyerID;
if (!buyerID || !parseInt(buyerID)) {
res.render('error', {message: "Failed to update order make sure the ID is current", error:{status:"", stack: ""}});
} else {
mongoClient.connect(url, function (err, db) {
if (err) {
res.render('error', {message: "Failed to connect to MongoDB", error:{status:"", stack: ""}});
} else {
var WishList = db.collection('orders');
var order = {
buyerID: req.body.buyerID,
gender: req.body.gender,
student: req.body.student,
pName: req.body.pName,
type: req.body.type,
purchaseDate: req.body.purchaseDate,
price: req.body.price,
sName: req.body.sName
};
console.log("Updating..", order)
WishList.updateOne({"buyerID": parseInt(buyerID)}, {$set: order}, function (err, result){
if (err) {
console.log("Cannot update", err)
} else {
console.log("Updated..", order)
res.redirect("/orders")
}
})
}
});
}
});
EJS
<!DOCTYPE html>
<html>
<head>
<title>Update Recipe</title>
<link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>
<form name= "updateOrder" action="/updateOrder" method="POST">
User ID:<br>
<input type="text" name="buyerID" value = "<%=qs.buyerID%>" required ="required"><br>
Gender:<br>
<input type="text" name="gender" value = "<%=qs.gender%>" required ="required"><br>
Student?:<br>
<input type="text" name="student" value = "<%=qs.student%>" required ="required"><br>
Product ID:<br>
<input type="text" name="productID" value = "<%=qs.productID%>" required ="required"><br>
Product Name:<br>
<input type="text" name="pName" value = "<%=qs.pName%>" required ="required"><br>
Product Type:<br>
<input type="text" name="type" value = "<%=qs.type%>" required ="required"><br>
Date Purchased:<br>
<input type="text" name="purchaseDate" value = "<%=qs.purchaseDate%>" required ="required"><br>
Product Price:<br>
<input type="text" name="price" value = "<%=qs.price%>" required ="required"><br>
Seller Name:<br>
<input type="text" name="sName" value = "<%=qs.sName%>" required ="required"><br>
<br><br>
<input type="submit" value="Submit" />
</form>
</body>
</html>
I'm actually confused by the fact that you're still using req.query.buyerID instead of req.body.buyerID at the start of your .post() but that the code does apparently still reach res.redirect("/orders"); For starters, in your updateOne, try replacing parseInt(buyerID) with parseInt(order.buyerID) – Chris G 10 hours ago
Related
I am trying to send a request using facebook MessengerExtensions.beginShareFlow(). I tried sending this API so that it redirects to a new page called schedules.
var messageToShare = {
"attachment":{
"type":"template",
"payload":{
"template_type":"generic",
"elements": [{
"title":"Garfield is going to the cinema",
"image_url": "https://webhookboi.herokuapp.com/schedule",
"subtitle": "You have been invited to join them, let them know when you are free",
"default_action": {
"type": "web_url",
"url": "https://webhookboi.herokuapp.com/schedule",
"messenger_extensions": "true",
"webview_height_ratio": "full",
"fallback_url": "https://webhookboi.herokuapp.com/schedule"
},
"buttons":[{
"type":"web_url",
"url":"https://webhookboi.herokuapp.com/schedule",
"title":"Select Times",
"messenger_extensions": "true"
}]
}]
}
}
};
and this is the beginShareFlow() encased inside a submit button listener
document.getElementById('submitButton').addEventListener('click', () => {
MessengerExtensions.beginShareFlow(function success(response) {
if(response.is_sent === true){
// User shared. We're done here!
MessengerExtensions.requestCloseBrowser();
}
else{
// User canceled their share!
MessengerExtensions.requestCloseBrowser();
}
},
function error(errorCode, errorMessage) {
// An error occurred trying to share!
},
messageToShare,
"current_thread");
});
The request will then be intercepted by these in the main javascript
app.get('/schedule', (req, res, next) => {
let referer = req.get('Referer');
if (referer) {
if (referer.indexOf('www.messenger.com') >= 0) {
res.setHeader('X-Frame-Options', 'ALLOW-FROM https://www.messenger.com/');
} else if (referer.indexOf('www.facebook.com') >= 0) {
res.setHeader('X-Frame-Options', 'ALLOW-FROM https://www.facebook.com/');
}
res.sendFile('public/schedule.html', {root: __dirname});
}
});
app.get('/schedulepostback', (req, res) => {
let body = req.query;
let response = {
"text": `Great, you have agreed to watch on ${body.dates} in the ${body.times} at ${body.locations} `
};
res.status(200).send('Please close this window to return to the conversation thread.');
callSendAPI(body.psid, response);
});
Here is the main problem, in the snippet below, I tried to call the threads psid again but it never showed.
<html>
<head>
<title>Set your Schedule</title>
</head>
<body>
<script>
(function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {
return;
}
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.com/en_US/messenger.Extensions.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'Messenger'));
window.extAsyncInit = () => {
// TODO: How to parse env file from here?
MessengerExtensions.getSupportedFeatures(function success(result) {
let features = result.supported_features;
if (features.includes("context")) {
MessengerExtensions.getContext(INPUTED_APP_ID_HERE,
function success(thread_context) {
// success
document.getElementById("psid").value = thread_context.psid;
document.getElementById("tid").value = thread_context.tid;
},
function error(err) {
// error
console.log(err);
}
);
}
},
function error(err) {
// error retrieving supported features
console.log(err);
});
var messageToShare = {
"text": `Your friend requested to watch on`.document.querySelector('input[name="dates"]:checked').value.'in the'.document.querySelector('input[name="times"]:checked').value.'at'.document.querySelector('input[name="locations"]:checked').value
};
document.getElementById('submitButton').addEventListener('click', () => {
MessengerExtensions.beginShareFlow(function success(response) {
if(response.is_sent === true){
// User shared. We're done here!
MessengerExtensions.requestCloseBrowser();
}
else{
// User canceled their share!
MessengerExtensions.requestCloseBrowser();
}
},
function error(errorCode, errorMessage) {
// An error occurred trying to share!
},
messageToShare,
"current_thread");
});
};
</script>
<form action="/schedulepostback" method="get">
<input type="text" name="psid" id="psid">
<input type="text" name="tid" id="tid">
<h3>Date</h3>
<input type="radio" name="dates" value="3 April" checked>3 April<br>
<input type="radio" name="dates" value="4 April">4 April<br>
<input type="radio" name="dates" value="5 April">5 April<br>
<input type="radio" name="dates" value="6 April">6 April<br>
<input type="radio" name="dates" value="7 April">7 April<br>
<h3>Time</h3>
<input type="radio" name="times" value="Daytime" checked>Daytime<br>
<input type="radio" name="times" value="Evening">Evening<br>
<h3>Location</h3>
<input type="radio" name="locations" value="Munich" checked>Munich<br>
<input type="radio" name="locations" value="Berlin">Berlin<br>
<input type="radio" name="locations" value="Dusseldorf">Dusseldorf<br>
<input type="submit" value="Submit" id="submitButton">
</form>
</body>
</html>
Is this because of my template type? or something else? Any help would be appriciated.
EDIT
If I click on the chat extension, everything works fine and the messenger extension works which produces this chat postback.
However when I click on the "Select Times" button on the postback, the psid doest show. The top Three bars were supposed to display the psid, tid, and object. This also didn't pop up in X-Frame but in a new tab. Any help here?
This is a really weird issue I am having.
I have a login form, this login form verifies your data and renders the Profile layout if the login is successful OR renders the register page if the login is not.
exports.logIn = function (req, res, data) {
var username = req.body.username.toString();
var password = req.body.password.toString();
connection.connection();
global.connection.query('SELECT * FROM Utilizador WHERE Nome_Utilizador = ? LIMIT 1', [username], function (err, result) {
if (result.length > 0) {
if (result) {
var object = JSON.parse(JSON.stringify(result));
var userObject = object[0];
var userQ = object[0].Nome_Utilizador;
global.connection.query('SELECT Password_Utilizador from Utilizador where Nome_Utilizador = ?', [username], function (err, result) {
console.log(result);
if (result.length > 0) {
if (result) {
var object2 = JSON.parse(JSON.stringify(result));
var passQ = object[0].Password_Utilizador;
if (password == passQ) {
console.log("Login efectuado com sucesso");
console.log(userObject);
res.render('home', { title: 'perfil', layout: 'perfil', data: userObject });
} else {
console.log("1");
}
}
} else if (err) {
console.log("asdsadas");
} else {
console.log("2");
res.render('home', { title: 'perfil', layout: 'registo' });
}
});
}
} else if (err) {
console.log(err);
} else {
console.log("Utilizador nao encontrado");
res.render('home', { title: 'perfil', layout: 'registo' });
}
});
};
This works.
And the only reason why it does work is because it comes from a FORM with a METHOD and an ACTION
<form id="login-nav" action="/login" method='POST' role="form" accept-charset="UTF-8" class="form">
<div class="form-group">
<label for="username" class="sr-only">Utilizador</label>
<input id="username" type="username" placeholder="Nome de utilizador" required="" class="form-control" name="username">
</div>
<div class="form-group">
<label for="exampleInputPassword2" class="sr-only">Palavra-Passe</label>
<input id="password" type="password" placeholder="Meta a palavra-passe" required="" class="form-control" name="password">
</div>
<div class="checkbox">
<label></label>
<input type="checkbox">Gravar Dados
</div>
<div class="form-group">
<button id="botaoLogin" class="btn btn-danger btn-block">Fazer Login</button>
</div>
</form>
However, I tried to do the same thing with jQuery, as I need to render a Handlebars layout for some products on button click,
$("#pacotes").on('click', ".produto", function () {
var prod = this.id;
console.log(prod);
$.get("http://localhost:3000/pacote?idPacote=" + prod);
});
And despite the query working and giving me the data I requested
exports.Pacote = function (req, res) {
var pacote = req.query.idPacote;
connection.connection();
global.connection.query('SELECT * FROM Pacotes WHERE idPacotes = ? ', [pacote], function (err, result) {
if (result.length > 0) {
if (result) {
var object = JSON.parse(JSON.stringify(result));
var packObject = object[0];
console.log(result);
res.render('home', { title: 'pacote', layout: 'pacote', data: packObject });
} else if (err) {
console.log(err);
}
};
});
}
It simply doesn't render the layout and I have no idea why.
What is the difference between doing a POST request like this or doing it by a form?
I don't understand why this only seems to work with forms.
I could solve it that way, but I don't think using empty forms for all my buttons would be a viable solution.
You are only making a request, you are not processing the return value:
$.get("http://localhost:3000/pacote?idPacote=" + prod);
Try changing to something like:
$.ajax({
method: 'GET',
url: "http://localhost:3000/pacote?idPacote=" + prod,
success: function(...) {...}
});
I'm trying to send a simple form from my HTML page to my Node JS server. The problem is that: I have a field that needs to be incresed by the user, so I'm using an array to express it. Everything OK but the array field appears like a String inside my JSON Object on the Server.
Here is the output from the Server:
{
nomeEquipe: 'Team',
nomeLider: 'Team Lider',
emailEquipe: 'email#email.com',
matriculaLider: '10101010',
senhaLider: '001001001',
'part[0].nome': 'Partner',
'part[0].matricula': '666',
'part[0].email': '666#email.com'
}
I can't access the part Array. The part Array can be incresed...
index.ejs (The form and the script):
<form method="post" action="/cadastrar">
<input type="text" name="nomeEquipe" placeholder="Nome da Equipe"><br>
<input type="text" name="nomeLider" placeholder="Lider da Equipe"><br>
<input type="email" name="emailEquipe" placeholder="Email do Lider"><br>
<input type="number" name="matriculaLider" placeholder="Matricula do Lider"><br>
<input type="password" name="senhaLider" placeholder="Senha de Login"><br><br>
<input type="text" name="part[0].nome" placeholder="Nome do participante">
<input type="number" name="part[0].matricula" placeholder="Matricula do participante">
<input type="email" name="part[0].email" placeholder="Email do participante">
<div id="participante"></div>
<br>
<button type="button" onclick="addParticipante()">Adicionar</button>
<button type="button" onclick="delParticipante()">Remover</button>
<br><br>
<button type="submit">Cadastrar</button>
</form>
<script>
var cont = 1;
function addParticipante() {
var div = document.createElement('div');
div.className = 'participante';
div.innerHTML = '<input type="text" name="part['+cont+'].nome" placeholder="Nome do participante"><input type="number" name="part['+cont+'].matricula" placeholder="Matricula do participante"><input type="email" name="part['+cont+'].email" placeholder="Email do participante">';
document.getElementById('participante').appendChild(div);
cont++
}
function delParticipante() {
var select = document.getElementById('participante');
document.getElementById('participante').removeChild(select.lastChild);
cont--
}
</script>
The Server side (Routes):
var express = require('express');
var router = express.Router();
var equipe = require('./../models/Equipe')();
router.get('/', function(req, res, next) {
res.render('index', { title: 'Gincana' });
});
router.get('/cadastrar', (req, res, next) => {
equipe.find({}, (err, models) => {
if(err) console.log(err)
else res.json(models)
});
});
router.post('/cadastrar', validador, (req, res, next) => {
var model = req.body;
res.send(model);
});
function validador(req, res, next) {
var model = req.body;
console.log(model);
next()
}
module.exports = router;
Thanks a lot!
Change naming of your element. It should be part[][]
<input type="email" name="part[0][email]">
Than you will have array like
{part:[
0: {
nome: 'Partner',
matricula: '666',
email: '666#email.com'
}
]}
i'm having problem implementing an update within my express application.
http://localhost:3000/update2?buyerID=2299
when i enter the link shown above it takes me to a form but its empty...
I want this form to be populated with the current values related to buyer ID document.
Can anyone see where i'm going wrong?
Thanks
json file
http://prntscr.com/dil1fj
js file
router.get('/update2', function(req, res) {
var buyerID = req.query.buyerID;
if (!buyerID || !parseInt(buyerID)) {
res.render('error', {message: "You need to enter an ID to update a specific order", error:{status:"", stack: ""}});
} else {
mongoClient.connect(url, function (err, db) {
if (err) {
res.render('error', {message: "Failed to connect to MongoDB",error:{status:"", stack: ""}});
} else {
var WishList = db.collection('orders');
WishList.findOne({"buyerID": parseInt(buyerID)}, function(err, result) {
if (err || !result || result.length == 0) {
res.render('error', {message: "Failed to find order",error:{status:"", stack: ""}});
} else {
res.render('updateOrder2', {updateOrder2: result, qs: req.query});
}
})
}
});
}
});
router.post('/update2', function(req, res) {
var buyerID = req.query.buyerID;
if (!buyerID || !parseInt(buyerID)) {
res.render('error', {message: "Failed to update order make sure the ID is current", error:{status:"", stack: ""}});
} else {
mongoClient.connect(url, function (err, db) {
if (err) {
res.render('error', {message: "Failed to connect to MongoDB", error:{status:"", stack: ""}});
} else {
var WishList = db.collection('orders');
var order = {
buyerID: req.body.buyerID,
gender: req.body.gender,
student: req.body.student,
pName: req.body.pName,
type: req.body.type,
purchaseDate: req.body.purchaseDate,
price: req.body.price,
sName: req.body.sName
};
console.log("Updating..", order)
WishList.updateOne({"buyerID": parseInt(buyerID)}, {$set: order}, function (err, result){
if (err) {
console.log("Cannot update", err)
} else {
console.log("Updated..", order)
res.redirect("/orders")
}
})
}
});
}
});
updateOrder2.ejs
<!DOCTYPE html>
<html>
<head>
<title>Update Recipe</title>
<link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>
<form name= "updateOrder" action="/updateOrder" method="POST">
User ID:<br>
<input type="text" name="buyerID" value = <%=qs.buyerID%>/ required ="required"><br>
Gender:<br>
<input type="text" name="gender" value = <%=qs.gender%>/ required ="required"><br>
Student?:<br>
<input type="text" name="student" value = <%=qs.student%>/ required ="required"><br>
Product ID:<br>
<input type="text" name="productID" value = <%=qs.productID%>/ required ="required"><br>
Product Name:<br>
<input type="text" name="pName" value = <%=qs.pName%>/ required ="required"><br>
Product Type:<br>
<input type="text" name="type" value = <%=qs.type%>/ required ="required"><br>
Date Purchased:<br>
<input type="text" name="purchaseDate" value = <%=qs.purchaseDate%>/ required ="required"><br>
Product Price:<br>
<input type="text" name="price" value = <%=qs.price%>/ required ="required"><br>
Seller Name:<br>
<input type="text" name="sName" value = <%=qs.sName%>/ required ="required"><br>
<br><br>
<input type="submit" value="Submit" />
</form>
</body>
</html>
I've never used ejs, but I'm pretty sure you a) need to at put at least values that contain spaces in quotes and b) remove the slashes. Also, What do you see as source code? Does it contain "value ="? If so, what is inserted after that? Also, you're passing qs: req.query to the renderer. Shouldn't you pass qs: result?
Regarding the update, I'm guessing this var buyerID = req.query.buyerID; at the start of router.post('/update2' is the problem; you need to use req.body.buyerID. I recommend adding lots of console.log() commands to your code at crucial lines.
I'm guessing this var buyerID = req.query.buyerID; at the start of router.post('/update2' is the problem; you need to use req.body.buyerID. I recommend adding lots of console.log() commands to your code at crucial lines. – Chris G 4 mins ago
Hi guys i ran into a problem that i don't understand why, it is very strange or maybe i write the code wrongly so i hope you guys can point out the mistake or enlighten me .
so i was trying to submit a form to my database and before submit the form the validate function will validate the data, if there's an error it will notify the user
when i click submit button the form cannot be submitted and nothing happened, no error in terminal , no error on console , nothing ( it looks like you click on <button> inside a form, while the form is expecting <input type="submit"> to submit the form>
here's the full code https://github.com/johnlim5847/form-test
App.js ( i think nothing wrong in here)
var express = require('express'),
app = express(),
http = require('http'),
path = require('path'),
MongoClient = require('mongodb').MongoClient,
routes = require('./routes'),
passport = require('passport');
MongoClient.connect('mongodb://localhost:27017/test', function(err, db) {
"use strict";
if(err) throw err;
// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/public/views');
app.set('view engine', 'ejs');
app.use('/static', express.static(path.join(__dirname, 'public')));
app.use(express.cookieParser());
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(express.session({ secret: 'Super Duper Awesome Duck' }));
app.use(passport.initialize());
app.use(passport.session());
app.use(app.router);
// development only
if ('development' == app.get('env')) {
app.use(express.errorHandler());
}
routes(app, db);
http.createServer(app).listen(app.get('port'), function(){
console.log('Express server listening on port ' + app.get('port'));
});
});
routes/index.js
var SessionHandler = require('./session');
module.exports = exports = function(app, db) {
var sessionHandler = new SessionHandler(db);
app.use(sessionHandler.isLoggedInMiddleware);
// Signup form
app.post('/register', sessionHandler.handleSignup);
app.use(function (req,res) {
res.status(404).render('error', {
url: req.originalUrl
});
});
app.get('*',function(req, res){
res.render('master', { title: 'form' });
});
}
routes/session.js
var UsersDAO = require('../users').UsersDAO
, SessionsDAO = require('../sessions').SessionsDAO;
/* The SessionHandler must be constructed with a connected db */
function SessionHandler (db) {
"use strict";
var users = new UsersDAO(db);
var sessions = new SessionsDAO(db);
function validateSignup(publicUsername, password, confirmPassword, email, confirmEmail, errors) {
"use strict";
var USER_RE = /^[a-zA-Z0-9_-]{2,25}$/;
var PASS_RE = /^.{6,100}$/;
var EMAIL_RE = /^[\S]+#[\S]+\.[\S]+$/;
errors['publicUsername_error'] = "";
errors['password_error'] = "";
errors['confirmPassword_error'] = "";
errors['email_error'] = "";
errors['confirmEmail_error'] = "";
if (!USER_RE.test(publicUsername)) {
errors['publicUsername_error'] = "Try just letters and numbers, e.g: Ed, 69, Kelvin and etc";
return false;
}
if (!PASS_RE.test(password)) {
errors['password_error'] = "Password must be at least 6 characters long";
return false;
}
if (password != confirmPassword) {
errors['confirmPassword_error'] = "Password must match";
return false;
}
if (!EMAIL_RE.test(email)) {
errors['email_error'] = "Invalid email address";
return false;
}
if (email != confirmEmail) {
errors['confirmEmail_error'] = "Email must match";
return false;
}
return true;
}
this.handleSignup = function(req, res, next) {
"use strict";
var email = req.body.email,
confirmEmail = req.body.confirmEmail,
password = req.body.password,
confirmPassword = req.body.confirmPassword,
firstName = req.body.firstName,
lastName = req.body.lastName,
penName = req.body.penName,
publicUsername = req.body.publicUsername;
// set these up in case we have an error case
var errors = {'email': email,'publicUsername': publicUsername,'firstName': firstName,'lastName': lastName,'penName': penName}
if (validateSignup(publicUsername, password, confirmPassword, email, confirmEmail, errors)) {
users.addUser(email, password, firstName, lastName, penName, publicUsername, function(err, user) {
"use strict";
if (err) {
// this was a duplicate
if (err.code == '11000') {
errors['email_error'] = "Email already in use. Please choose another";
return res.render("register", errors);
}
// this was a different error
else {
return next(err);
}
}
sessions.startSession(user['_id'], function(err, session_id) {
"use strict";
if (err) return next(err);
res.cookie('session', session_id);
return res.redirect('/');
});
});
} else {
console.log("user did not validate");
return res.render("register", errors);
}
}
}
register.ejs
<div class="pure-u-1 text-center">
<form method="post" class="pure-form pure-form-aligned">
<fieldset>
<legend><h1 class="pure-splash-subhead midnightblue"><span class='lightblue'>Join</span> us today and start write things that <span class='maroon'>matter</span></h1>
</legend>
<p class="text-center red">{{email_error}}</p>
<div class="pure-control-group">
<label for="email">Email Address</label>
<input required name="email" class="pure-u-1-3" type="email" placeholder="Email Address">
</div>
<div class="pure-control-group">
<p class="text-center red">{{confirmEmail_error}}</p>
<label for="confirmEmail">Confirm Email Address</label>
<input required name="confirmEmail" class="pure-u-1-3" type="email" placeholder="Confirm Email Address">
</div>
<div class="pure-control-group">
<p class="text-center red">{{password_error}}</p>
<label for="password">Password</label>
<input required name="password" class="pure-u-1-3" type="password" placeholder="Password">
</div>
<div class="pure-control-group">
<p class="text-center red">{{confirmPassword_error}}</p>
<label for="confirmPassword">Confirm Password</label>
<input required name="confirmPassword" class="pure-u-1-3" type="password" placeholder="Confirm Password">
</div>
<br/>
<br/>
<div class="pure-control-group">
<label for="firstName">First Name</label>
<input required name="firstName" class="pure-u-1-3" type="text" placeholder="Your first name">
</div>
<div class="pure-control-group">
<label for="lastName">Last Name</label>
<input required name="lastName" class="pure-u-1-3" type="text" placeholder="and your last name">
</div>
<div class="pure-control-group">
<label for="penName"><abbr title="A pen name, nom de plume, or literary double, is a pseudonym adopted by an author. The author's real name may be known to only the publisher, or may come to be common knowledge.">Nom de plume</abbr></label>
<input required name="penName" class="pure-u-1-3" type="text" placeholder="Pen Name eg:J.R.R. Tolkien">
</div>
<div class="pure-control-group">
<label for="publicUsername">Public Username</label>
<input required name="publicUsername" class="pure-u-1-3" type="text">
<p class="text-center red">{{publicUsername_error}}</p>
</div>
<div class="pure-u-1 ">
<label for="conAndTerm" class="pure-checkbox">
<input id="conAndTerm" type="checkbox"> I've read the <a class='link blue'href="#">terms and conditions</a>
</label>
<br/>
<input type='submit'class="pure-button pure-button-secondary pure-u-1-3" value="Register">
<br/>
</div>
</fieldset>
</form>
</div>
i think it might be a silly mistake i hope there's nothing wrong with my HTML tag LOL
ok, so after short debugging session:
taken from Angular's docs
Since the role of forms in client-side Angular applications is
different than in classical roundtrip apps, it is desirable for the
browser not to translate the form submission into a full page reload
that sends the data to the server. Instead some javascript logic
should be triggered to handle the form submission in an
application-specific way.
For this reason, Angular prevents the default action (form submission
to the server) unless the element has an action attribute
specified.
so it seems like you did not provide proper handling for form submit :-)
so either provide one or add the 'action' attribute to the form - that should "fix" it
let me know if that makes sense to you.
You're missing the action attribute inside your form tag in register.ejs
It should be as following
<form method="post" action="/user/register" class="pure-form pure-form-aligned">
Now upon hitting "submit" a POST request will be generated and server shall look for a post type of route mentioned in action.
Another thing that's wrong with your code is ... you need to declare SessionHandler function using "exports" keyword as mentioned below.
exports.SessionHandler = async (req, res, next) => {
// Session handler with arrow function
}
OR
exports.SessionHandler = async function (req, res, next) {
// Session handler without arrow function
}
I believe you need a space so that type='submit'class becomes: type='submit' class.