Возвращение хрустящей формы в ответ на ajax-запрос
Я пытаюсь заполнить форму данными через ajax запрос. Вот мои попытки на данный момент:
view.py:
def ajaxGetData(request):
pnr=int(request.GET.get('pnr',None))
instance=User.objects.get(pnr=pnr)
form=User_Form(instance=instance,prefix="Userdata")
return HttpResponse(form.as_p())
Ajax Code:
$.ajax({
url: '{%url 'ajaxGetData'%}',
type: "get",
data: {
'pnr': pnr,
},
success: function (data) {
if (data) {
$('#Userdata-Content').html(data);
}
}
});
Это работает, но форма не отображается с помощью crispy-forms. Есть ли какой-нибудь код типа
return HttpResponse(form.as_crispy())
Что бы вернуть хрустящую форму?
PS: Я совсем новичок в Django и разработке сайтов в целом. Я хочу сделать сайт, где можно выбрать пользователя из списка в боковой части страницы, а затем отредактировать кучу данных о нем. Из того, что я прочитал, я понял, что для этого нужно сделать одностраничный сайт. Буду очень благодарен, если кто-нибудь подскажет мне, правильно ли это.
Приветствую!
Вам необходимо установить модуль crispy и далее как использовать crispy формы в django https://django-crispy-forms.readthedocs.io/en/latest/crispy_tag_forms.html
Django Crispy Forms имеет помощник render_crispy_form
для рендеринга формы внутри python кода.
Так что ваш views.py:
from django.template.context_processors import csrf
from crispy_forms.utils import render_crispy_form
from django.http import JsonResponse
def ajaxGetData(request):
pnr = int(request.GET.get('pnr'))
instance = User.objects.get(pnr=pnr)
form = User_Form(instance=instance, prefix="Userdata")
ctx = {}
ctx.update(csrf(request))
# ⬇️⬇️⬇️
form_html = render_crispy_form(form, context=ctx)
return JsonResponse({"form_html": form_html})
Обратите внимание, что вы должны предоставить
render_crispy_form
необходимый CSRF токен, иначе он не будет работать.
Я предлагаю вам использовать JsonResponse
jQuery будет выглядеть следующим образом:
$.ajax({
url: "{% url 'ajaxGetData' %}",
type: "get",
data: {
'pnr': pnr,
},
success: function (data) {
if (data) {
$('#Userdata-Content').html(data['form_html']);
}
}
});