У меня небольшой Django проект, состоящий из одного приложения. Я очень новичок в Django и столкнулся с проблемой. У меня есть приложение, которое представляет собой веб-страницу с заданным вопросом и формой, которая должна иметь вклад. После того, как кнопка нажата для отправки формы, я бы хотел обновить страницу без обновления. Я слышал, AJAX - это хороший способ справиться с этим, но я не смог найти ни одного примера, работающего только с формами.
ОБНОВЛЕНИЕ
после изучения предложений других пользователей, я сделал несколько ход выполнения ajax для отображения текста отправки формы. Проблема заключается в том, что при переходе на страницу приложения отображается только необработанный html. Я не уверен, почему.
Мои формы
from django import forms
from . import models
class AnswerForm(forms.Form):
answer = forms.CharField(label='Answer', required=True, max_length=500)
def save(self):
answer_instance = models.Answer()
answer_instance.answer_txt = self.cleaned_data["answer"]
answer_instance.save()
return answer_instance
Мои модели
from django.db import models
from django.forms import ModelForm
class Riddle(models.Model):
riddle_txt = models.CharField(max_length=900)
def __str__(self):
return self.riddle_txt
class Answer(models.Model):
answer_txt = models.CharField(max_length=900)
def __str__(self):
return self.answer_txt
Мои просмотры
from django.http import JsonResponse
from django.shortcuts import get_object_or_404, render
from django.template import loader
from .models import Riddle, Answer
from . import forms
# Create your views here.
def index(request):
form = forms.AnswerForm()
response_data = {} #new line
if request.method == "POST":
form = forms.AnswerForm(request.POST)
if form.is_valid():
form.save()
form = forms.AnswerForm()
response_data['text'] = form.answer_txt #new line
else:
form = forms.AnswerForm()
riddle_list = Riddle.objects.all()
answer_list = Answer.objects.all()
form = forms.AnswerForm()
template = loader.get_template('CricksRiddles/index.html')
context = {
'riddle_list': riddle_list,
'form': form,
'answer_list': answer_list,
}
#form_answer = request.POST['_form']
return render(request, 'CricksRiddles/index.html', context, {'json_data': json.dumps(response_data)}) #new line
Мои JS
$('#answer_form').on('submit', function(e){
e.preventDefault();
console.log("form submitted");
post_answer();
});
function post_answer() {
console.log("answer is posted without refresh");
console.log($('#answer_text').val());
}
и, наконец, вот
МОИ Шаблоны
{% extends 'base.html' %}
{% load static %}
{% block content%}
<body>
{% if riddle_list %}
<div class="riddle_box">
{% for riddle in riddle_list %}
<!-- <a href="{% url 'CricksRiddles:info' riddle.id %}"></a> -->
<p>{{ riddle.riddle_txt }}</p>
{% endfor %}
<!--
<!--{% for ans in answer_list %}-->
<li>{{ ans.answer_txt }}</li>
<!--{% endfor %}-->
</div>
<form id="answer_form" action="/" method="post">
{% csrf_token %}
{{ form.as_p }}
<input type="submit" class="button" name="_form" value="Submit Answer">
</form>
{% else %}
<p>Out foraging for sticks and dogs.</p>
{% endif %}
</body>
{% endblock %}
{% block js_block %}
{% endblock %}
Насколько я понимаю, код AJAX будет go в блоке js_block, но снова я не могу найти информацию об использовании AJAX с формой django. Все, что я нашел, было модельными формами, но я не хочу использовать их. Спасибо за любую помощь.