Kay+pjaxのコーディング例 #python #gae

pythonコードとかテンプレートの中にpjaxのためだけに条件分岐を書くのが面倒なので、こうすれば楽できるんじゃないかなという書き方の一例。多分他にも方法はあると思う。

まずはベースになるテンプレートを用意する。これはbase.htmlにしておく。base.htmlではpjaxでのアクセスかどうかを判断して、pjaxだったらpjaxbase.htmlというpjax用のテンプレートを継承するようにする。そうじゃない場合は、普通に表示。

base.html
{% if 'X-PJAX' in request.headers %}
{% extends "myapp/pjaxbase.html" %}
{% else %}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>{{ title }}</title>
{{ compiled_css('style.css') }}
{{ compiled_js('script.js') }}
</head>
<body>
<div id="wrapper">
<ul id="menu">
<li><a href="/" class="pjax">Top</a>
<li><a href="/menu1" class="pjax">menu1</a>
<li><a href="/menu2" class="pjax">menu2</a>
<li><a href="/menu3" class="pjax">menu3</a>
</ul>
<div id="content">
{% block content %}{{ content }}{% endblock %}
</div>
</div>
</body>
</html>
{% endif %}

pkax用のテンプレートにはコンテンツと、タイトルに細工をするスクリプトを仕込む。

pjaxbase.html
{% block content %}{{ content }}{% endblock %}
<script>$(function(){$("title").text("{{ title }}");});</script>

実際に使うときはbase.htmlを継承して、contentブロックを適当に書き換えればOK。
{% extends "myapp/base.html" %}
{% block content %}{{ content }}へようこそ{% endblock %}



posted by 右京 | Python
blog comments powered by Disqus
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。