As I wrote in the title, I'd like to get a value from a variable written into a ejs page/file, from a javascript file within the same page
EJS:
<% var test = 101; %>
JS:
<script> var getTest = test; </script>
Or what if I'd like to use a function (with parameter) written into a EJS file and use this function in a JS context where the parameter is given to the function from JS context
EJS:
<% function fn(par){ ... } %>
JS:
<script> var test = 101; <%>fn(test)<%> </script>
It is possible to access JS variable in . ejs file. You just need to pass the JS object as second parameter of res. render() method.
A variable declaration starts with the keyword var followed by the variable name, e.g. : var myVariable; The variable declaration ends with a semi-colon. The names of the variables in EJS-templates are case-sensitive: myVariable and myvariable are different variables.
EJS or Embedded Javascript Templating is a templating engine used by Node. js. The template engine helps to create an HTML template with minimal code. Also, it can inject data into the HTML template at the client-side and produce the final HTML.
To render a variable as HTML in EJS, we can use various tags. to run code code which is evaluated but not printed. to evaluate and print out code as an escaped string. to evaluate and print out code as is.
Edit: this Half considers you are using EJS on server side
1) You can pass an ejs variable value to a Javascript variable
<% var test = 101; %> // variable created by ejs <script> var getTest = <%= test %>; //var test is now assigned to getTest which will only work on browsers console.log(getTest); // successfully prints 101 on browser </script>
simply create an ejs variable and assign the value inside the script tag to the var getTest
Ex: var getTest = <%= test %>;
2) You can't pass an javascript variable value to a ejs variable
Yes, you cant: if it is on server.
Why:
The EJS template will be rendered on the server before the Javscript is started execution(it will start on browser), so there is no way going back to server and ask for some previous changes on the page which is already sent to the browser.
3) if EJS is on client side, and pass EJS variable to javascript
The answer above will still work, but you will require to load the script within the EJS template, not the script loaded before the template rendered(in that case it will of-course no be a valid javascript).
4) if EJS is on client side, and pass javascript variable to EJS
I m sorry I have myself not tried this case, but I really look forward if someone answers this case
The above answer didn't work for me. You can use a div this way:
<div id="mydiv" data-test=<%= test %>></div>
And access the data variable 'test' that you gave it in a script tag:
<script>var test = document.getElementById('mydiv').dataset.test</script>
https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/dataset
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With