I'm using Express.js with EJS to render the response from a database query as an html unordered list. I'm also using json2html. I'm not getting any errors but my list item elements are not getting rendered as HTML. What am I doing wrong?
The page renders in my browser like this -
My Express router handler -
var $stmt = squel.select().from('GrpPractice').field('*').toString();
router.get('/', handler1);
function handler1(req, res) {
db.all($stmt, function(err, rows) {
var transform = {'tag':'li', 'html':'${Organization legal name}'};
var html = json2html.transform(rows, transform);
res.render('index', { title: 'Group Practices', html });
// res.send(rows);
});
}
And my EJS template -
<body>
<h1><%= title %></h1>
<p>Welcome to <%= title %></p>
<ul>
<%= html %>
</ul>
</body>
My data appears well formed -
[{"Organization legal name":"23RD FAMILY MED LLC","Group Practice PAC ID":"3375715477","Number of Group Practice members":5,"First Name":"CHERL","Last Name":"MUES","Credential":"","Primary specialty":"NURSE PRACTITIONER"},{"Organization legal name":"23RD FAMILY MED LLC","Group Practice PAC ID":"3375715477","Number of Group Practice members":5,"First Name":"PAUL","Last Name":"GLOWACKI","Credential":"MD","Primary specialty":"FAMILY PRACTICE"},{"Organization legal name":"23RD FAMILY MED LLC","Group Practice PAC ID":"3375715477","Number of Group Practice members":5,"First Name":"MONTY","Last Name":"SELLON","Credential":"","Primary specialty":"FAMILY PRACTICE"},{"Organization legal name":"23RD FAMILY MED LLC","Group Practice PAC ID":"3375715477","Number of Group Practice members":5,"First Name":"MILO","Last Name":"ANDERSON","Credential":"","Primary specialty":"FAMILY PRACTICE"},{"Organization legal name":"23RD FAMILY MED LLC","Group Practice PAC ID":"3375715477","Number of Group Practice members":5,"First Name":"ANDREW","Last Name":"OPP","Credential":"","Primary specialty":"FAMILY PRACTICE"},{"Organization legal name":"3-D OPTICAL","Group Practice PAC ID":"1951361732","Number of Group Practice members":4,"First Name":"KRISTEN","Last Name":"KOSIR","Credential":"OD","Primary specialty":"OPTOMETRY"},{"Organization legal name":"3-D OPTICAL","Group Practice PAC ID":"1951361732","Number of Group Practice members":4,"First Name":"NIROPA","Last Name":"PRASAD","Credential":"","Primary specialty":"OPTOMETRY"},{"Organization legal name":"3-D OPTICAL","Group Practice PAC ID":"1951361732","Number of Group Practice members":4,"First Name":"ROBERT","Last Name":"MCCAMY","Credential":"OD","Primary specialty":"OPTOMETRY"},{"Organization legal name":"3-D OPTICAL","Group Practice PAC ID":"1951361732","Number of Group Practice members":4,"First Name":"DARREL","Last Name":"CRISSLER","Credential":"","Primary specialty":"OPTOMETRY"},{"Organization legal name":"5MD CONVENIENT CARE LLC","Group Practice PAC ID":"2567643026","Number of Group Practice members":4,"First Name":"JULIE","Last Name":"HATCH","Credential":"","Primary specialty":"NURSE PRACTITIONER"}]
If I log to console it looks like valid html
<li>23RD FAMILY MED LLC</li><li>23RD FAMILY MED LLC</li><li>23RD FAMILY MED LLC</li><li>23RD FAMILY MED LLC</li><li>23RD FAMILY MED LLC</li><li>3-D OPTICAL</li><li>3-D OPTICAL</li><li>3-D OPTICAL</li><li>3-D OPTICAL</li><li>5MD CONVENIENT CARE LLC</li>
If I view page source in the browser (thank you Tomasz Jakub Rup), not so valid...
<body>
<h1>Group Practices</h1>
<p>Welcome to Group Practices</p>
<ul>
<li>23RD FAMILY MED LLC</li><li>23RD FAMILY MED LLC</li><li>23RD FAMILY MED LLC</li><li>23RD FAMILY MED LLC</li><li>23RD FAMILY MED LLC</li><li>3-D OPTICAL</li><li>3-D OPTICAL</li><li>3-D OPTICAL</li><li>3-D OPTICAL</li><li>5MD CONVENIENT CARE LLC</li>
</ul>
</body>
Can anyone identify what I'm doing wrong? It appears as if my browser is interpreting this as a text string, rather than markup.