この内容は古いバージョンです。最新バージョンを表示するには、戻るボタンを押してください。
バージョン:2
ページ更新者:T
更新日時:2026-06-10 17:35:42

タイトル: ajaxの使用例(POST編)
SEOタイトル: 【django】

この本文には実行可能なタグ等が含まれるため、安全のためHTMLソースとして表示しています。本文データは変更していません。

<p>今回の例ではページの閲覧数をajaxでカウントアップする。</p>

<h2>テンプレートの実装</h2>

<table border="1" cellpadding="1" cellspacing="1" style="width:1000px">
	<tbody>
		<tr>
			<td style="background-color:#000000">
			<p><span style="color:#ffffff"><a id="{{ page.page_id }}" href="{{ page.link }}" target="_blank" onclick="</span><span style="color:#2ecc71">page_view_countup</span><span style="color:#ffffff">(this)"></span></p>

			<p><span style="color:#ffffff"><script><br />
			function </span><span style="color:#2ecc71">page_view_countup</span><span style="color:#ffffff">(a) {</span></p>

			<p><span style="color:#ffffff">&nbsp; &nbsp; </span><span style="color:#e74c3c">var token = '{{csrf_token}}';</span><br />
			<span style="color:#ffffff">&nbsp; &nbsp; var page_id = a.id;</span></p>

			<p><span style="color:#ffffff">&nbsp; &nbsp; </span><span style="color:#f1c40f">$.ajax({<br />
			&nbsp; &nbsp; &nbsp; &nbsp; 'url': '/ajax/page/countup',<br />
			&nbsp; &nbsp; &nbsp; &nbsp; </span><span style="color:#e74c3c">headers: { "X-CSRFToken": token },</span><br />
			<span style="color:#f1c40f">&nbsp; &nbsp; &nbsp; &nbsp; 'type':'</span><span style="color:#e74c3c">POST</span><span style="color:#f1c40f">',<br />
			&nbsp; &nbsp; &nbsp; &nbsp; 'data':{<br />
			&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 'page_id': page_id,<br />
			&nbsp; &nbsp; &nbsp; &nbsp; },<br />
			&nbsp; &nbsp; &nbsp; &nbsp; 'dataType':'json',<br />
			&nbsp; &nbsp; &nbsp; &nbsp; 'success':function(response){<br />
			&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log(response)<br />
			&nbsp; &nbsp; &nbsp; &nbsp; },<br />
			&nbsp; &nbsp; });</span><br />
			<span style="color:#ffffff">}<br />
			</script></span></p>
			</td>
		</tr>
	</tbody>
</table>

<p>&nbsp;</p>

<h2>URLの定義</h2>

<table border="1" cellpadding="1" cellspacing="1" style="width:1000px">
	<tbody>
		<tr>
			<td style="background-color:#000000">
			<p><span style="color:#ffffff">urlpatterns = [<br />
			&nbsp; &nbsp; </span><span style="color:#f1c40f">path('ajax/page/countup', PageCountupView.as_view()),</span><br />
			<span style="color:#ffffff">]</span></p>
			</td>
		</tr>
	</tbody>
</table>

<p>&nbsp;</p>

<h2>ビューの定義</h2>

<table border="1" cellpadding="1" cellspacing="1" style="width:1000px">
	<tbody>
		<tr>
			<td style="background-color:#000000">
			<p><span style="color:#ffffff">from django.http import JsonResponse<br />
			from django.views.generic import View<br />
			from db_itn.models.page import page</span></p>

			<p><span style="color:#ffffff">class pageCountupView(View):</span></p>

			<p><span style="color:#ffffff">&nbsp; &nbsp; def </span><span style="color:#e74c3c">post</span><span style="color:#ffffff">(self, request, *args, **kwargs):</span></p>

			<p><span style="color:#ffffff">&nbsp; &nbsp; &nbsp; &nbsp; page_id = request.</span><span style="color:#e74c3c">POST</span><span style="color:#ffffff">['page_id']</span></p>

			<p><span style="color:#ffffff">&nbsp; &nbsp; &nbsp; &nbsp; page = page.objects.get(page_id = page_id, delete_flag = 0)<br />
			&nbsp; &nbsp; &nbsp; &nbsp; page.objects.filter(page_id = page_id, delete_flag = 0).update(views = page.views + 1)</span></p>

			<p><span style="color:#ffffff">&nbsp; &nbsp; &nbsp; &nbsp; context = {<br />
			&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; # 'page': page,<br />
			&nbsp; &nbsp; &nbsp; &nbsp; }</span></p>

			<p><span style="color:#ffffff">&nbsp; &nbsp; &nbsp; &nbsp; return JsonResponse(context)</span></p>
			</td>
		</tr>
	</tbody>
</table>