How to add dynamic information in the header script?

Question

I have a Django website that retrieves scores of various items. I would like to make the score appear when a user clicks on a link. The problem is, how do I create this functionality when all of my Jquery code is located in the head?

For example, I have the following code in my head:

  $(document).ready(function() {
    var $addedElem = $('<p>New Element</p>');
    $('.display').one('click', function() {
      $addedElem.hide().appendTo("#container").fadeIn("slow");
    });
  });

Where it defines addedElem, I would like it to add the "score" that the view gives to me. So, I would normally be doing this: {{ score }} , but how would I add this to addedElem if I do not have access to it? I am using Django's templating system, so I only have access in the innermost body elements and not the head.

Answer 1

Base template have access to context of its inherited templates, {{ score }} will work. You should of course handle the situation when there is no score provided.

If you want this code only for a particular page, you can define {% block head_ext %}{% endblock %} in base template and override it in child template. It's ok to call $(document).ready() more than once.