using Django Template Variables in javascript

Question

I'm writing an app that needs dynamic javascript. I didn't know how to use Django template variable in javascript. when I searched I found some answeres like Django Template Variables and Javascript but I still have the problem. when I write this piece of code in my html :

        <script>jQuery(document).ready(function ($) {
           $(".nav").css({"opacity": "0.5"});
           $("#description").animate({opacity: '+=0.5'}, 10000);
           });
        </script>

every thing is fine. the navbar is transparent and <p id="description">{{description}}</p>is shown by jquery animate function. but when i change it to this:

      <script>jQuery(document).ready(function ($) {
           $(".nav").css({"opacity": "0.5"});
           var a = "{{description}}";
           $("#description").animate({opacity: '+=0.5'}, 10000);
           });
      </script>

the navbar is no more transparent and the description is no more shown. what is the problem ?

p.s : I changed a to a = "{{blah}}"; and there is no problem with it. the problem apears when It is a real template variable.

The javascript you've included is pretty much no different between code examples, You have an unused variable containing a string of `description` but other than that its the same — Sayse, Nov 02 '15 at 08:08
but when I define this unused variable the script does not work any more. that is my problem. — Dorna96, Nov 02 '15 at 08:19
Are you using angular.js or something else that uses the same django syntax? adding unused variables shouldn't affect anything — Sayse, Nov 02 '15 at 08:21
when I change a to a = "{{blah}}"; there is no problem. so it understand that it is a template variable but then it is failed to continue. i don't know why. — Dorna96, Nov 02 '15 at 08:36

score 1 · Answer 1 · answered Nov 02 '15 at 08:48

Use verbatim:

Stops the template engine from rendering the contents of this block tag.

A common use is to allow a JavaScript template layer that collides with Django’s syntax. For example:
{% verbatim %}
     {{if dying}}Still alive.{{/if}} 
{% endverbatim %}

using Django Template Variables in javascript

1 Answers1