장고-Ajax
Ajax는 기본적으로 페이지로드 수를 줄이기 위해 함께 통합 된 기술의 조합입니다. 우리는 일반적으로 Ajax를 사용하여 최종 사용자 경험을 용이하게합니다. Django에서 Ajax를 사용하는 것은 JQuery 또는 기타와 같은 Ajax 라이브러리를 직접 사용하여 수행 할 수 있습니다. JQuery를 사용하려는 경우 Apache 또는 기타를 통해 서버에 라이브러리를 다운로드하고 제공해야합니다. 그런 다음 Ajax 기반 애플리케이션을 개발할 때와 마찬가지로 템플릿에서 사용합니다.
Django에서 Ajax를 사용하는 또 다른 방법은 Django Ajax 프레임 워크를 사용하는 것입니다. 가장 일반적으로 사용되는 것은 django-dajax로, Python을 사용하고 JavaScript 소스 코드를 거의 사용하지 않고 웹 애플리케이션에서 비동기 프리젠 테이션 논리를 쉽고 빠르게 개발할 수있는 강력한 도구입니다. 가장 인기있는 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 += (
'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 += patterns('',
url(r'^%s/' % settings.DAJAXICE_MEDIA_PREFIX, include('dajaxice.urls')),)
urlpatterns += 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()이제 우리의 형식을 가진 dreamreal.html 템플릿을 만들어 보겠습니다.
<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, 'dreamreal.html', locals())myapp / urls.py에 해당 URL을 추가하십시오-
url(r'^dreamreal/', 'dreamreal', name = 'dreamreal'),이제 Ajax가 작동하도록 템플릿에 필요한 사항을 추가해 보겠습니다.
파일 상단에 추가-
{% load static %}
{% load dajaxice_templatetags %}그리고 dreamreal.html 템플릿의 <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 collectstaticNote − 때때로 jquery.dajax.core.js가 누락 될 수 있습니다.이 경우 소스를 다운로드하고 해당 파일을 가져 와서 정적 폴더에 넣으십시오.
/ myapp / dreamreal /에 액세스하면 다음 화면이 표시됩니다. −
제출시 다음 화면이 표시됩니다.
