Djangoでpjax！

今話題(?)のpjaxをdjangoで使ってみることにした。

百聞は一見に如かずということで、まずはソースから

<!DOCTYPE html>
<html lang="ja">
  <head>
    <title>{% block title %}DjangoProject{% endblock %}</title>
    <meta name="generator" content="PyScripter"/>
    <meta charset="utf8"/>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    {% load staticfiles %}
    <script type="text/javascript" src="{% static 'jquery.pjax.js' %}"></script>
    <script type="text/javascript">
        $(function(){
            $(document).pjax('a', {
                container : '#pjax-container',
                fragment : '#pjax-container'
            });
            $(document).on('submit', 'form', function(event) {
                $.pjax.submit(event, {
                    container : '#pjax-container',
                    fragment : '#pjax-container'
                });
            });
        });
    </script>
  </head>
  <body>
    <div id="pjax-container">
        {% block contents %}
        {% endblock %}
    </div>
  </body>
</html>

load staticfilesと{% static ‘jquery.pjax.js’ %}で静的ファイルを読み込んでます。

静的ファイルの設定はsetting.pyの

STATICFILES_DIRSに対象ディレクトリを

“C:/Users/admin/python/django/taskapp/static”

みたいな感じで設定してあげればOK。

これでstatic で読み込んだ時に自動的に対象パスを検索してくれます。

そんで肝心のpjaxはベースとなるテンプレートファイルにJSで

$(document).pjax('a', {
    container : '#pjax-container',
    fragment : '#pjax-container'
});

みたいに書いてあげればOK。

これを継承しているテンプレート全てにpjaxが適用されるみたいな。

凄い楽ちんなのに高速画面遷移でテンション上がりました。