I am trying to include an ejs file that contains functions for setting up my views. These functions were defined to be used a helpers. I have tried using:
<% include helpers.ejs %>
But when I try to use the function from this file:
<% module_start('$body', [{name:'display',value:'block'}], 'body'); %>
I get the error:
Reference Error: module_start is not defined
When I copy over the code from 'helpers.ejs' to my original view file, 'test.ejs', it works as expected. I have gone through several answers and,
am still confused what am I doing wrongly in this case.
Thanks for your help in advance.
After some grueling hours of trying every conceived solutions out there, I have landed upon a solution that is working. The solution was borrowed from:
EJS Functions
Looking at the solution presented in this code, I updated my 'helpers.ejs' to 'helpers.js'. Following this, I added the exported functions from 'helpers.js' to the ejs render context object:
const ejs_helpers = require('path/to/helpers.js');
...
ejs.renderFile('filename', { helpers:ejs_helpers, ...}, (err,data)=>{});
In the ejs view file:
<%- helpers.function_name(params); %>
This considerably changes how I initially approached the problem. With plain ejs helper file, the functions include HTML in between the control flow statements. In the case presented here, the functions returns plain string. Notice the '-' with the 'Scriptlet' tag.
Hope this helps someone.
Related
I am using EJS in the browser (not on the server).
I have some ejs that I would like to use in multiple pages, so I want to put that in its own file, say table.ejs.
Is there a way I can include it in my HTML such that it is immediately accessible to my javascript after onload?
I was thinking something like:
<script id="table-ejs" type="text/ejs" src="ejs/table.ejs"></script>
then in my javascript:
ejs.render(document.querySelector('#table-ejs').???, data)
Is this possible?
I could use the Fetch API to retrieve the ejs file but then I would need to rewrite a lot of code to make it async. I was wondering if I could avoid that.
Well,
place all your ejs-files within a file "views" - within your views you can create another file "partials" - in this file you place your header and footer.ejs.
Within, lets say, your home.ejs you have to include the following code:
<%- include('partials/header'); -%>
// the rest of your code
<%- include('partials/footer'); -%>
You can find more here: https://ejs.co/#docs
A proposed change to the Content Security Policy (CSP) of our web server to disallow inline script
is causing a problem with the documentation generated by doxygen. Specifically, the problem occurs
in the generated index.html file, and the following lines:
<!-- Generated by Doxygen 1.8.15 -->
<script type="text/javascript" src="menudata.js"></script>
<script type="text/javascript" src="menu.js"></script>
<script type="text/javascript">
/* #license magnet:?xt=urn:btih:cf05388f2679ee054f2beb29a391d25f4e673ac3&dn=gpl-2.0.txt GPL-v2 */
$(function() {
initMenu('',false,false,'search.php','Search');
})
/* #license-end */</script>
If the initMenu() code is put into a separate file that is just included like other JavaScript files, everything
works just fine. Is there a doxygen option to put all JavaScript into files rather that inline? We can
post process the generated file to do this, but may not know when the "pattern" of this code may
change due to updates in doxygen itself. And we may not know if using additional doxygen features will result in other inline JavaScript.
Any suggestions would be welcome.
Thank you
Fritz Sieker
First off Content Security Policy is useful but far from being an absolute authority. There are other completely useless headers such as those that block referrers based on "privacy".
Secondly there is no such thing as "text/javascript", perhaps they meant application/javascript?
If you're using good (though very non-common practices) you don't have any script elements in the body element (use defer="true" on script elements in the head). By doing that you'll better understand the structure of JavaScript and that in turn will help you become more proficient/capable/help more people/make more money/etc.
You can use document.getElementsByTagName('body')[0].getElementsByTagName('script') to find all the script elements in the body element that don't belong there.
If you do have script elements in the body element beforehand and moving them to the head element is not feasible right now you're likely going to have to work with inherent logic, in short those script elements will always be inserted in to the DOM in a specific and reasonably easily reproducible area of your code (like as the very last elements). In such a case you can find them via the following:
document.getElementsByTagName('body')[0].lastChild
document.getElementsByTagName('body')[0].lastChild.previousSibling
document.getElementsByTagName('body')[0].lastChild.previousSibling.previousSibling
Keep in mind that pressing Enter in your code to make it more readable will insert a textNode so you may want to append nodeName to those instances and look for "script":
console.log(document.getElementsByTagName('body')[0].lastChild.nodeName);
There is the DOM TreeWalker that might help you out here, subjective to the end result in your DOM. I don't know offhand if you can transverse all the elements in reverse (probably).
Once you know what you want to delete instead of making everything convoluted just send that object (or id) to the following:
function element_del(id)
{
if (typeof id=='string' && id_(id) && id_(id).parentNode.removeChild)
{
id_(id).parentNode.removeChild(id_(id));
}
else if (typeof id=='object' && typeof id.parentNode=='object') {id.parentNode.removeChild(id);}
}
//Example:
element_del(document.getElementsByTagName('body')[0].lastChild);
I hope this helps!
I am new to sails, and trying to output a basic list coming from the find action from the blueprints.
Using an example view from the docs:
<ul>
<% _.each(data, function (project) { %>
<li><%= project.name %></li>
<% }) %>
</ul>
and checking the value of matchingRecords in the node-inspector returns [] (which i expected).
The view however lists 2 items with value undefined, see image below:
If I add data into the model, it iterates over the json returned by the blueprint char by char. I must be doing something wrong, but I am kind of stumped. I originally used Jade, and thought maybe there is something wonky with the template adapter, but as I said, ejs gives me a very similar result.
What I am doing wrong ?
It seems there is a bug in sails at the moment of writing.
An issue has been opened on Github https://github.com/balderdashy/sails/issues/3932
I am new to Play Framework and still trying to wrap my head around some things with the new Scala template engine.
Let's say I have the following package structure:
app/
app/controllers/Items.scala
app/models/Item.scala
app/views/layouts/page.scala.html
app/views/item/show.scala.html
app/views/item/details.scala.html //partial
And this is my item/show template:
#(item: Item, form: Form[Item])(implicit flash: Flash)
#layout.page() {
#*want to include details partial, wont work due to item param*#
#item.details(item)
}
Since including another template (e.g. including item/details above) is the exact same syntax as accessing a template parameter (e.g. item above), obviously this existing naming convention won't work without something changing.
I know I can rename my "app.views.item" package to "app.views.items", and rely on singular/plural forms to differentiate the view from the param name, but this does not seem like a very straightforward solution. Also what if I really want the parameter name to be the same as the view package?
One idea I have is to prepend all my views with an extra top level package:
app/views/views/item/details.scala.html
So the include syntax would be #views.item.details(), but again this is obviously a hack.
What is a good way to avoid this issue? How can I better organize my code to avoid such naming collisions?
Most other template engines use operations like "include" or "render" to specify a partial include. I don't mean to offend anyone here, but is the Play Scala template engine syntax so terse that it actually dictates the organization of code?
3 solutions:
First
Typpicaly for partial templates you should use tags as described in the docs, where app/views/tags folder is a base:
file: app/views/tags/product.scala.html
in the templates (no initial import required in the parent view full syntax will allow you to avoid name-clash: #tags.packageName.tagName()):
<div id="container">
#tags.product(item)
</div>
Of course in your case you can also use packages in the base folder
file: app/views/tags/item/product.scala.html
<div id="container">
#tags.item.product(item)
</div>
I'm pretty sure that'll solve your problem.
Second
To avoid clash without changing package's name you can just rename the item in your view, also I recommend do not use a form name for the Form[T] as it can conflict with helpers:
#(existingItem: Item, existingItemForm: Form[Item])(implicit flash: Flash)
#layout.page() {
#item.details(existingItem)
}
Third
If you'll fill your Form[Item] before passing to the view with given Item object, you don't need to pass both, as most probably you can get data from the form:
#(itemForm: Form[Item])(implicit flash: Flash)
#layout.page() {
<div>Name of item is: #itemForm("name").value (this is a replacemnet for ##existingItem.name </div>
#item.details(itemForm)
}
Of course in you product.scala.html you'll need to change the #(item: Item) param to #(itemForm: Form[Item])
I have a need to create a <br/> tag in the display label for a menu item generated using Zend_navigation, but don't seem to be able to find a way to do so.
My navigation item is defined in the XML config as:
<registermachine>
<label>Register your Slitter Rewinder</label>
<controller>service</controller>
<action>register</action>
<route>default</route>
</registermachine>
I want to force a tag in the output HTML between 'your' and 'slitter', such that it appears on two line as below:
Register your
Slitter Rewinder
However, I can't seem to do it. obviously using in the XML breaks parsing, and using html entities means that the lable is displayed as:
Register your <br/>Slitter Rewinder
Has anyone had experience of this that can offer advice?
Thanks in advance!
there is no such option built-in you have to use a partial
$partial = array('menu.phtml', 'default');
$this->navigation()->menu()->setPartial($partial);
echo $this->navigation()->menu()->render();
http://framework.zend.com/manual/en/zend.view.helpers.html#zend.view.helpers.initial.navigation.menu
you may also try a hack with <label><![CDATA[Menu label<br/>Second line]]></label>
I found a (hacky) solution:
I updated my navigation.xml to use {br} tokens wherever a <br/> tag is required, and then amended the base Zend/View/Helper/Navigation/Menu.php file as follows:
within htmlify function, changed
$this->view->escape($label)
to
str_replace("{br}", "<br/>", $label)
I could (and probably will) override the Zend Library Menu View Helper with my own at some point, but this at least cover it for now.
there is a escapeLabels boolean used to convert html tags and it's true by default.
You can set your navigation like this
$this->navigation()
->menu()
->escapeLabels(false)
->...
http://framework.zend.com/apidoc/2.0/classes/Zend.View.Helper.Navigation.Menu.html#escapeLabels