Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can a js script get a variable written in a EJS context/page within the same file

Tags:

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> 
like image 731
Donovant Avatar asked Feb 19 '15 10:02

Donovant


People also ask

How do I pass a variable from JavaScript to EJS?

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.

Can you declare variables in EJS?

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.

Can we use JavaScript in EJS?

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.

How do you render a variable in EJS?

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.


2 Answers

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.


Edit: this Half considers you are using EJS on Client side

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

like image 138
Naeem Shaikh Avatar answered Sep 19 '22 03:09

Naeem Shaikh


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

like image 33
Hugo Avatar answered Sep 18 '22 03:09

Hugo