How to pass twig variables to a js file included using <script src="...">

Question

For a twig template file, I want to separate the js content from my HTML content, so I have created a .js file

with this content:

  {% if form.vars.data is not null %} 
  function downloadInvoice() {
    window.location = '{{ path('ziiweb_billing_bill', {'id': form.vars.data.id}) }}';
  }
  {% endif %}

  function updateTotals() {
      $('#service_download_pdf').css("pointer-events", "none");
      $('#service_download_pdf').attr("disabled", "true");

that Im adding using this line:

<script type="text/javascript" src="/bundles/ziiwebbilling/js/service_form.js"></script>

but get this error:

SyntaxError: expected expression, got '%' {% if form.vars.data is not null %}

smarber · Accepted Answer · 2016-05-17 19:29:50Z

1

You cannot put twig into your js files. However to pass twig variables to js files, you need to do have a script inside your twig file like this:

twig file

<script>
     //var data = {{ form.vars.data|default('') }};
     // I think it's better to pass the url directly
     {% if form.vars.data is not null %}
          var url = '{{ path('ziiweb_billing_bill', {'id': form.vars.data.id}) }}';
     {% endif %}
</script>

<script type="text/javascript" src="/bundles/ziiwebbilling/js/service_form.js"></script>

service_form.js

  if (typeof url === 'undefined') {
      // If the url exists
  }

Furthermore, there is a bundle that exposes routes https://github.com/FriendsOfSymfony/FOSJsRoutingBundle

At the end, you should not define a js function if a test is valid, however you should check when running the function

answered May 17, 2016 at 19:29

smarber

5,1447 gold badges41 silver badges86 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to pass twig variables to a js file included using <script src="...">

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related