I need to display data that gets posted after rendering view with res.render() in get. When I use <% date %> my view throws an error saying that date is not defined and I know this happens because my value does not exist before rendering the view and its getting set after. So how do I set this variable to be displayed in my ejs file before or after my view gets rendered?
I have tried a few things like using res.send(), using another get() inside my post() and even creating a partial view but nothing works. I dont want to click any buttons to be able to do this and if its only possible with clicking well then. I know you cant use res.send() on the same view twice .
My post XMLHttpRequest is executed when the page loads in javascript to set my date variable and send it to my node.js file then I use express to fetch it. My node.js code is the following:
app.get('/', function (req, res) {
res.render('index', {
time: time,
views: visitors,
mobileViews: mobileVisitors,
});
}
app.post('/', function(req, res){
console.log('working');
getInfo = req.body;
console.log(getInfo);
//getInfo.date = 1
res.render('index', {dataTest: getInfo.date}); //this doesnt work
//OR res.send({dataTest: getInfo.date}); doesnt work
//OR app.get('/', function (req, res) {res.render ... doesnt work
}
My ejs view is:
<h1 class="test">test <%= dataTest %></h1>
My js file:
var waitForEl = function (selector, callback) {
if (jQuery(selector).length) {
callback();
} else {
setTimeout(function () {
waitForEl(selector, callback);
}, 100);
}
};
waitForEl(".daterangepicker", function () {
var element = document.querySelector('.ranges ul').childNodes[0].childNodes[0].data.toString();
console.log(element);
var date = 0;
date = sendData(date, element);
var obj = JSON.stringify({date: date});
console.log(obj);
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://localhost:4000", true);
xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhr.send(obj);
});
function sendData(date, element) {
if(element == 'Today') {
date = 1;
}
return date;
}
try this :
const bodyParser =require('body-parser');
const urlencodedParser = bodyParser.urlencoded({ extended: false });
app.get('/', function (req, res) {
res.render('index', {
time: time,
Views: visitors,
mobileViews: mobileVisitors,
});
}
app.post('/',urlencodedParser,function(req, res){
console.log('working');
getInfo = req.body;
console.log(getInfo);
res.render('index', {getInfo: getInfo});
}
you need also a midlleware to handle post method in express app
npm i body-parser
it's better to use the object's key name as its value name to ease cycling through the properties
then in your ejs view use :
<%= getInfo.date %>
there is an = sign,don't forget it.
What I see is the first time you are trying to get "/" you don't have a getInfo.date
So make a getInfo.date = Date.now()
Or getInfo.date = new Date()
And pass it in into your initial get('/') call.
const bodyParser =require('body-parser'); const urlencodedParser = bodyParser.urlencoded({ extended: false }); app.get('/', function (req, res) { res.render('index', { time: time, Views: visitors, mobileViews: mobileVisitors, getinfo: getInfo}); } app.post('/',urlencodedParser,function(req, res){ console.log('working'); getInfo = req.body; console.log(getInfo); res.render('index', {getInfo: getInfo}); }
const bodyParser =require('body-parser'); const urlencodedParser = bodyParser.urlencoded({ extended: false }); app.get('/', function (req, res) { res.render('index', { time: time, Views: visitors, mobileViews: mobileVisitors, getinfo: getInfo}); } app.post('/',urlencodedParser,function(req, res){ console.log('working'); getInfo = req.body; console.log(getInfo); res.render('index', {getInfo: getInfo}); }
.
on the other hand you may also choose to make the
getInfo.date = null
orgetInfo.date = ''
And check in your ejs with if condition if(getinfo.date){<=getinfo.date>}
Trying from mobile. Hope this solves
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.