Простая форма Django с Ajax Submission не обновляет модель

Я пытаюсь написать простую форму с использованием Ajax. После нескольких попыток я продолжаю получать "POST /app/emails/ HTTP/1.1" 200 13950 в Terminal, но модель не обновляется (даже когда я смотрю в shell).

Мне бы очень хотелось иметь возможность отправлять форму внутри модала и обновлять изображение за ним. Однако если это невозможно, я могу согласиться на альтернативу.

Очень застрял здесь, буду рад любому совету!

emails.html

<div class="modal fade" id="addEmailModal" data-bs-backdrop="static" data-bs-keyboard="false"
 tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-sm">
    <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title" id="staticBackdropLabel">Add New Email</h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal"
                    aria-label="Close"></button>
        </div>
        <div class="modal-body">
            <form method="POST" id='add-email'>
                {% csrf_token %}
                <fieldset class="form-group">
                    {{ form|crispy }}
                </fieldset>
                <div class="form-group">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close
                    </button>
                    <button class="btn btn-primary" type="submit">Add</button>
                </div>
            </form>

        </div>
    </div>
</div>

Javascript

$("#add-email").submit(function (e) {
        e.preventDefault();
        alert('working');

       $.ajax({
        type: 'POST',
        url: "{% url 'add-emailname' %}",
         data: {
         email_name = $(this).email_name,
         cadence = $(this).cadence
         },
         success: function (response) {
            alert("Email name successfully added!")
            $("#add-email").trigger('reset'); //clear the form
            },
        error: function (response) {
            // alert the error if any error occured
            alert(response["responseJSON"]["error"]);
        }
    })
}

views.py

def emails(request):
context = {
    'emails': UserEmail.objects.all(),
    'form': EmailCreateForm()
}
return render(request, 'app/emails.html', context)

def addEmailName(request):
    if request.is_ajax and request.method == "POST":
        form = EmailCreateForm(request.POST)
        if form.is_valid():
            form.save()
            returned_email_name = form.cleaned_data.get('email_name')
            messages.success(request, f'{returned_email_name} added as new Email!')
            # send to client side.
            return JsonResponse({"success": True}, status=200)
        else:
            # some form errors occured.
            return JsonResponse({"error": form.errors}, status=400)
    # some error occured
    return JsonResponse({"error": ""}, status=400)

forms.py

class EmailCreateForm(ModelForm):
class Meta:
    model = UserEmail
    fields = ['email_name', 'cadence']

def __init__(self, *args, **kwargs):
    super(EmailCreateForm, self).__init__(*args, **kwargs)  # Call to ModelForm constructor
    self.fields['email_name'].widget.attrs['rows'] = 1
    self.fields['cadence'].widget.attrs['rows'] = 1

urls.py

urlpatterns = [
path('', views.home, name='app-home'),
path('emails/', views.emails, name='app-emails'),
path('post/ajax/addEmailName', addEmailName, name='add-emailname')]

Вернуться на верх