i built up a nodejs app using express and ejs as template engine. i can show a list of articles in a page but i don't know how to show detail of article when i click on the item. using Angular 4 you can use components and inject componets on the same page showing details in one compement when you click the item in the other one. i was wondering if it is possible to achieve same goal with ejs
<div class="container">
<div class="row">
<div class="col-lg-4">
<% items.forEach(item){%>
<ul>
<li><%=item%></li>
</ul>
<% } %>
</div>
<div class="col-lg-8>[here details of article]</div>
</div>
</div>
Related
After upgrading to SAP Commerce 2105 Patch 13 from 1811, components with type CMSParagraphComponent do not have img, span HTML tags and HTML tag attributes like class, style.
Before upgrade HTML was displaying in the page as following:
<div class="content">
<div class="size-guide__area active" data-js="size-guide-area">
<div>
<div class="size-guide__close" data-js="size-guide-close">
My text
<span class="icon-close-circle"></span>
</div>
</div>
</div>
</div>
My component is covered with <true class="yCmsComponent"></true> after upgrade somehow.
After upgrade HTML is displaying as following:
<true class="yCmsComponent">
<div class="content">
<div>
<div>
<div>
My Text
</div>
</div>
</div>
</div>
</true>
impex:
INSERT_UPDATE CMSParagraphComponent;$contentCV[unique=true];uid[unique=true];name;&componentRef;content[lang=$lang];
;;chartParagraph;Chart Paragraph;chartParagraph;"<div class='size-guide__area' data-js='size-guide-area'>
<div>
<div class='size-guide__close' data-js='size-guide-close'>
My text
<span class='icon-close-circle'></span>
</div>
usage in tag file:
<cms:component uid="chartParagraph" evaluateRestriction="false"/>
CMSParagraphComponentRenderer class is sanitizing HTML. Rules are defined in HtmlSanitizerPolicyProvider class. It is checking a property before sanitizing. I solved issue by changing the property in storefront extension. You may customize HtmlSanitizerPolicyProvider class to have a safer solution. Changing following property may cause an issue, it is not the safest solution.
In the project.properties file of the storefront extension, add following property.
cms.components.allowUnsafeJavaScript=true
I am trying to display image based on the path I get from database
here's my code
<% cars.forEach(function(car) { %>
<div class="card">
<div class="img">
<img src="images/" +"<%=car.Img_path %>">
</div>
</div>
<% }); %>
I also tried <img src="images/<%=car.Img_path %>"> but not working.
Can Anyone suggest how to render image.
Thanks In Advance.
<img src="images/<%=car.Img_path %>"> works. My issue was i didn't included Img_path in car model.
whoever may get this type of issue make sure you have included that field in model otherwise you will have data in database for but you wont get it in your application
How to define or update style="width:<%=MettingPer %>;" for progress bar in ejs
<li class="list-group-item d-flex justify-content-between align-items-center">
Meeting
<div class="progress">
<div class="progress-bar progress-bar-striped bg-success progress-bar-animated" role="progressbar" style="width: 75%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
<%=MettingPer %>%</div>
</div>
</li>
EJS is rendered on the server, not the browser, so EJS has no idea what document is since that's something that's only defined in the browser.
So for this you need to load your page completely on the client side with zero value.
Then complete it according to the instructions in JavaScript.
And as soon as you receive a response from the server, complete and hide it with a little delay.
Let’s say that I have a carousel on my index page.
Inside the template for index, it loads a particular channel, “Foo”
<div "slider">
<ul class="slides">
{exp:low_reorder:entries set="foo" dynamic="no"}
<li class="foo_{entry_id}">
<div class="container">
<div class="row-fluid">
<div class="span12">
{foo_html}
<style type="text/css">{foo_css}</style>
</div>
</div>
</div>
</li>
{/exp:low_reorder:entries}
</ul>
</div>
That channel, naturally, has a list of content items
I want the list of content items displayed to exclude one of the items in the channel if the referrer is not bing.
Can anyone show me the way that they would go about accomplishing that? I'm not getting any traction on the ellislab forum.
I whipped up a plugin for you, which you can find here
You can wrap the item in a conditional using that plugin to check if it should be output.
Can I use handlebars to create template or module structure like this
<div id="container">
<div id="left">
//include module A src
</div>
<div id="right">
//include module B src
</div>
</div>
If it cannot, what is a good template engine that can couple with nodejs do achieve the above? I come from java web framework, and this can be achieve very easy but it is not so apparent here.
Check partial section of handlebarsjs docs.
So first you register the partials:
Handlebars.registerPartial('moduleA', fs.readFileSync('moduleA.html'));
Handlebars.registerPartial('moduleB', fs.readFileSync('moduleB.html'));
Then in the html you do this:
<div id="container">
<div id="left">
{{> moduleA}}
</div>
<div id="right">
{{> moduleB}}
</div>
</div>