ジャンゴ-アヤックス

Ajaxは基本的に、ページの読み込み回数を減らすために一緒に統合されたテクノロジーの組み合わせです。通常、エンドユーザーエクスペリエンスを容易にするためにAjaxを使用します。 DjangoでAjaxを使用するには、JQueryなどのAjaxライブラリを直接使用します。 JQueryを使用する場合、Apacheなどを介してサーバーにライブラリをダウンロードして提供する必要があるとします。次に、Ajaxベースのアプリケーションを開発するときと同じように、テンプレートで使用します。

DjangoでAjaxを使用する別の方法は、Django Ajaxフレームワークを使用することです。最も一般的に使用されるのはdjango-dajaxです。これは、Pythonを使用してJavaScriptソースコードをほとんど使用せずに、Webアプリケーションで非同期プレゼンテーションロジックを簡単かつ迅速に開発する強力なツールです。最も人気のある4つのAjaxフレームワーク、Prototype、jQuery、Dojo、MooToolsをサポートしています。

Django-dajaxを使用する

最初に行うことは、django-dajaxをインストールすることです。これは、easy_installまたはpipを使用して実行できます-

$ pip install django_dajax
$ easy_install django_dajax

これにより、django-dajaxに必要なdjango-dajaxiceが自動的にインストールされます。次に、dajaxとdajaxiceの両方を構成する必要があります。

INSTALLED_APPSオプションのプロジェクトsettings.pyにdajaxとdajaxiceを追加します-

INSTALLED_APPS &plus;= (
   'dajaxice',
   'dajax'
)

同じsettings.pyファイルで、次のものがあることを確認してください-

TEMPLATE_LOADERS = (
   'django.template.loaders.filesystem.Loader',
   'django.template.loaders.app_directories.Loader',
   'django.template.loaders.eggs.Loader',
)

TEMPLATE_CONTEXT_PROCESSORS = (
   'django.contrib.auth.context_processors.auth',
   'django.core.context_processors.debug',
   'django.core.context_processors.i18n',
   'django.core.context_processors.media',
   'django.core.context_processors.static',
   'django.core.context_processors.request',
   'django.contrib.messages.context_processors.messages'
)

STATICFILES_FINDERS = (
   'django.contrib.staticfiles.finders.FileSystemFinder',
   'django.contrib.staticfiles.finders.AppDirectoriesFinder',
   'dajaxice.finders.DajaxiceFinder',
)

DAJAXICE_MEDIA_PREFIX = 'dajaxice'

今myapp/url.pyファイルに移動し、dajax URLを設定し、dajax statics jsファイルをロードするために次のものがあることを確認してください-

from dajaxice.core import dajaxice_autodiscover, dajaxice_config
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from django.conf import settings

Then dajax urls:

urlpatterns &plus;= patterns('',
   url(r'^%s/' % settings.DAJAXICE_MEDIA_PREFIX, include('dajaxice.urls')),)

urlpatterns &plus;= staticfiles_urlpatterns()

Ajaxを使用して、Dreamrealモデルに基づいて単純なフォームを作成し、保存します（更新なし）。

最初に、myapp/form.pyにDreamrealフォームが必要です。

class DreamrealForm(forms.Form):
   website = forms.CharField(max_length = 100)
   name = forms.CharField(max_length = 100)
   phonenumber = forms.CharField(max_length = 50)
   email = forms.CharField(max_length = 100)

次に、アプリケーションにajax.pyファイルmyapp/ajax.pyが必要です。それが私たちのロジックであり、フォームを保存する関数を入れてポップアップを返す場所です-

from dajaxice.utils import deserialize_form
from myapp.form import DreamrealForm
from dajax.core import Dajax
from myapp.models import Dreamreal

@dajaxice_register
def send_form(request, form):
   dajax = Dajax()
   form = DreamrealForm(deserialize_form(form))

   if form.is_valid():
      dajax.remove_css_class('#my_form input', 'error')
      dr = Dreamreal()
      dr.website = form.cleaned_data.get('website')
      dr.name = form.cleaned_data.get('name')
      dr.phonenumber = form.cleaned_data.get('phonenumber')
      dr.save()

      dajax.alert("Dreamreal Entry %s was successfully saved." %
         form.cleaned_data.get('name'))
   else:
      dajax.remove_css_class('#my_form input', 'error')
      for error in form.errors:
         dajax.add_css_class('#id_%s' % error, 'error')

   return dajax.json()

今、私たちのフォームを持つdreamreallテンプレートを作成しましょう-

<html>
   <head></head>
   <body>

      <form action = "" method = "post" id = "my_form" accept-charset = "utf-8">
         {{ form.as_p }}
         <p><input type = "button" value = "Send" onclick = "send_form();"></p>
      </form>

   </body>
</html>

myapp/views.pyにテンプレートに付属するビューを追加します-

def dreamreal(request):
   form = DreamrealForm()
   return render(request, 'dreamreall', locals())

myapp/urls.pyに対応するURLを追加します-

url(r'^dreamreal/', 'dreamreal', name = 'dreamreal'),

次に、テンプレートに必要なものを追加して、Ajaxを機能させます。

ファイルの上部に追加します-

{% load static %}
{% load dajaxice_templatetags %}

そして、私たちのdreamreallテンプレートの<head>セクションに追加します-

この例ではJQueryライブラリを使用しているため、追加します-

<script src = "{% static '/static/jquery-1.11.3.min.js' %}"
   type = "text/javascript" charset = "utf-8"></script>
<script src = "{% static '/static/dajax/jquery.dajax.core.js' %}"></script>

クリック時に呼び出されるAjax関数-

<script>

   function send_form(){
      Dajaxice.myapp.send_form(Dajax.process,{'form':$('#my_form').serialize(true)});
   }
</script>

静的ファイルディレクトリに「jquery-1.11.3.min.js」が必要であり、jquery.dajax.core.jsも必要であることに注意してください。すべてのdajax静的ファイルが静的ディレクトリの下で提供されるようにするには、次を実行します-

$python manage.py collectstatic

注意-jquery.dajax.core.jsが欠落している場合があります。その場合は、ソースをダウンロードしてそのファイルを取得し、静的フォルダーに配置してください。

/myapp/dreamreal/にアクセスすると、次の画面が表示されます-

Django-dajaxの使用

送信すると、次の画面が表示されます-

Django-dajax Responseの使用

Django-ajax

ジャンゴ-アヤックス

Django-dajaxを使用する