Node.js pass a value to a partial view - node.js

I have a route that looks like this:
app.get('/Search', function (req, res) {
var searchString = req.query.SearchString;
var request = require('./cstapi')(searchString, onBody);
function onBody(body) {
res.render('index', { output: body });
}
});
and an index.ejs that looks like this:
<div id="searchDiv">
<% include ../partials/search %>
<br>
<% include ../partials/results %>
</div>
search looks like this:
<form action="./search" method="GET">
<input type="text" name="SearchString" class="form-control" >
<input type="submit" value="Search" class="form-control">
</form>
and results looks like this:
<p>Search returned the following: <%= output %></p>
I'm trying to get the search results to display in a partial view after the user submits the form. With the above I get output is not defined when attempting to render index and the subsequent partial views.

I found a work around although I'm not 100% sure this is the best way of doing it:
By adding 'null check' to output in index I can avoid the output not defined error when accessing the results partial without search results.
So index now becomes:
<div id="searchDiv">
<% include ../partials/search %>
<br>
<%if (typeof output !== 'undefined') { %>
%> <% include ../partials/results %>
<% } %>
</div>
Hopefully someone can provide a better way?

Related

Ejs passed variable not showing

I am using express framework in node js.
for page rendering i use ejs.
given below route i passed 3 variable doctors title or loggined user id
router.get('/doctors/:id',passportConf.isAuthenticated, function(req,res,next){
Doctor.find({category:req.params.id})
.populate("category")
.exec(function(err, doctors){
if (err) return next (err);
res.render('main/doctor', {doctors: doctors, title:'doctors', id: req.user._id})
})
});
now problem is when i access these variable like this then i get my variable data
<%= doctors[i]._id%> or <%= title %> or <%= id%>
but when i acces these variable data in if statment then id data give nothing
i tried this in if statment
user id is 5cfaa0e32e21cb3c88885260
if (doctor[i]._id != '5cfaa0e32e21cb3c88885260')
then my code worked fine
if (id != '5cfaa0e32e21cb3c88885260')
thene my code not work
my ejs code
<% for(i=0; i<doctors.length; i++) {%>
<small><%= doctors[i].category.name%></small>
<ul>
<% if (id != '5cfaa0e32e21cb3c88885260') {%>
<form method="post">
<input class="form-control" type="hidden" name="doctor_id" value="<%= doctors[i]._id%>">
<button class="btn_1 medium" type="submit">Book now</button>
</form>
<%}%>
</ul>
</div>
</div>
<%}%>

EJS unexpected Token "else"

I have a problem with syntax in ejs which isn't obvious to me:
<form class="dataForm" action="<%= template.actionPath %>" method="post">
<% for(var i in template.inputVar) { %>
<label><%= template.inputVar[i].labelName %></label>
<br>
<% if (template.inputVar[i].type == "option") { %>
<select name="<%= template.inputVar[i].name %>">
for(var j in template.inputVar[i].options) { %>
<option value="<%= template.inputVar[i].options[j] %>"><%= template.inputVar[i].options[j] %></option>
<% } %>
</select>
<% } else { %>
<input type="<%= template.inputVar[i].type %>" name="<%= template.inputVar[i].name %>">
<% } %>
<br><br>
<% } %>
I am rendering a webpage where a form is created. Now I want to add a feature that allowes me to have selections in my form.
Unfortunately ejs does not like my the "else" it says:
SyntaxError: Unexpected token else in C:\Users\etc... while compiling ejs
I did some research about this issue but I could not find something that might help me.
Your for line is missing the opening ejs script tag
for(var j in template.inputVar[i].options) { %>
to
<% for(var j in template.inputVar[i].options) { %>
Also, you should close your form tag

Passing an array to a EJS view, using Bookshelf.JS

My logic:
/* GET /events/list */
router.get('/events/list', function(req, res) {
new db.Tag({})
.fetchAll()
.then(function(tags) {
res.locals.title = "List of events";
res.locals.tags = tags;
res.render('events/list.ejs');
});
});
My view:
<% for (var tag in tags) { %>
<div class="checkbox">
<label>
<input type="checkbox" data-tag-id="<%= tag.tagId %>" />
<%= tag.name %>
</label>
</div>
<% } %>
What I'm getting:
[x] undefined
[x] undefined
[x] undefined
[x] undefined
What I should be getting:
[x] foo
[x] bar
[x] zort
[x] troz
I also tried passing
res.locals.tags = tags.toJSON();
and also
res.locals.tags = JSON.stringify(tags);
So.. how do I finally pass my collection to an EJS view?
I also logged (console.log(tags)) just after then(function(tags) and I'm getting the models (tags in this case) correctly.
I also tried tags.forEach in my EJS view but a native javascript array like this: [{tagId:1, name:"blah"}, {tagId:2, name"Foo"}] doesn't have "forEach" method implemented
In your template, use forEach (if available) or loop using the index instead.
server.js
res.locals.tags = tags.toJSON();
view.html (with [].forEach)
<% tags.forEach(function(tag) { %>
<div class="checkbox">
<label>
<input type="checkbox" data-tag-id="<%= tag.tagId %>" />
<%= tag.name %>
</label>
</div>
<% }) %>
view.html (with indices)
<% for (var i in tags) { %>
<div class="checkbox">
<label>
<input type="checkbox" data-tag-id="<%= tags[i].tagId %>" />
<%= tags[i].name %>
</label>
</div>
<% } %>
Here's an alternative to using Array.prototype.forEach. You give the Bookshelf collection to the view. Bookshelf.Collection has its own .forEach:
server.js
res.locals.tags = tags; // NOT .toJSON()
view.html
<% tags.forEach(function(tag) { %>
<div class="checkbox">
<label>
<input type="checkbox" data-tag-id="<%= tag.id %>" />
<%= tag.get('name') %>
</label>
</div>
<% }) %>

How to pass textbox param in nodejs

I tried to pass textbox as a parameter in each render.
and tried following,
in controller,
res.render('index', { dynamic_textbox: '<input type="text" value="test" />' });
and in index.ejs,
<%= dynamic_textbox %>
It displaying result as a string not textbox..
Please any one..
EJS autoescapes output by default. The following will be escaped:
<%= dynamic_textbox %>
You need to use this syntax instead, if you want to output raw HTML:
<%- dynamic_textbox %>

nodejs + ejs for if express returns a unexpected catch

im sure this is silly, but i cant get it to work for the life of me, i just want to do a simple for statement with an if inside on ejs, but it keeps returning a unexpected catch event in express.
to set up the scene, i've got a JSON thats setting up a a registration form in nodejs using ejs as my template renderer, lets say I have the following code:
var userData:{
"username":"User name",
"email":"johndoe#gmail.com",
"password":"Please enter Password",
"birthdate":"date"
}
and i have a ejs file that goes
<h1 id="page-title"><%= title %></h1>
<div id="list">
<form action="user/create/" method="post" accept-charset="utf-8">
<div class="item-new">
<% for (var key in userData){ %>
<% if(key != 'birthdate'){ %>
<input class="input" type="text" name="<%= key %>" placeholder="<%= userData[key] %>"/>
<% }else{ %>
//do something
<% } %>
</div>
i've tried to define a variable beforehand and check the value of the definitions
If the example you provided is indeed all of your code, you aren't closing all of your tags, specifically, you aren't closing your for loop, one of your divs, or your form. When I close all of these, the view will render for me without errors. This is the ejs that I used:
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style-min.css' />
</head>
<body>
<h1 id="page-title"><%= title %></h1>
<div id="list">
<form action="user/create/" method="post" accept-charset="utf-8">
<div class="item-new">
<% for (var key in userData){ %>
<% if(key != 'birthdate'){ %>
<input class="input" type="text" name="<%= key %>" placeholder="<%= userData[key] %>"/>
<% } else{ %>
<% } %>
<% } %>
</div>
</form>
</div>
</body>
</html>
And I used this function to render it:
exports.test = function(req, res){
res.render('test', { title: 'nodejs + ejs for if express returns a unexpected catch', userData:{
"username":"User name",
"email":"johndoe#gmail.com",
"password":"Please enter Password",
"birthdate":"date"
}});
};
When I use the above I get this as a result:

Resources