django.js 0.2

verbatim

A {% verbatim %} tag is available to ease the JS templating. It escape a specific part. For example, you may want a subpart of your template to be rendered by Django :

<script type="text/x-handlebars" id="tpl-django-form">
    <form>
        {% verbatim %}
            {{#if id}}<h1>{{ id }}</h1>{{/if}}
        {% endverbatim %}
        {{ yourform.as_p }}
    </form>
</script>

django_js

A {% django_js %} tag is available to provide the Django JS module. After loading, you can use the Django module to resolve URLs and Translations:

{% django_js %}
<script>
    $(Django).on('ready', function() {
        console.log(
            Django.url('my-view'),
            Django.url('my-view', 'arg1'),
            Django.url('my-view', ['arg1']),
            Django.url('my-view', {key: 'test'}),
            Django.trans('my string')
        );
    });
</script>

If you want to manually trigger initialization, you can set the init keyword to false:

{% django_js init=false %}
<script>
    $(Django).on('ready', function() {
        console.log(
            Django.url('my-view'),
        );
    });
    Django.init();
</script>

The jQuery libary is automatically loaded. If you want to manually load the jquery, you can set the jquery keyword to false:

{% django_js jquery=false %}

django_js tag also configure jQuery.ajax to handle CSRF tokens.

jquery_js

The {% jquery_js %} tag only load the jQuery (1.8.2) library.

The django_js and django_js_init tags automatically load jQuery so no need to manually load it.

javascript/js

The js tag is a quick helper to include javascript files from {{STATIC_URL}}:

{% javascript "js/my.js" %}
{% js "js/my.js" %}

is equivalent to:

<script type="text/javascript" src="{% static "js/my.js" %}"></script>

css

The css tag is a quick helper to include css files from {{STATIC_URL}}:

{% css "css/my.css" %}

is equivalent to:

<link rel="stylesheet" type="text/css" href="{% static "css/my.css" %}" />

js_lib

The js_lib tag is a quick helper to include javascript files from {{STATIC_URL}}js/libs:

{% js_lib "my-lib.js" %}

is equivalent to:

<script type="text/javascript" src="{{STATIC_URL}}js/libs/my-lib.js"></script>