Django Ajax и предотвращение обновления при отправке формы

Итак, у меня есть Django-based from, который работает идеально (я знаю, хоть раз что-то действительно работает, кто бы мог подумать?), отправляется, как и ожидалось, без каких-либо проблем.

Однако Ajax - это совсем другая рыба. Этот Ajax-скрипт должен указать браузеру не обновлять страницу, когда пользователь отправляет информацию с помощью формы ниже.

Хотя, строго говоря, это действительно останавливает обновление окна браузера, это также превращает кнопку отправки в мертвую.

Вы нажимаете на него, и ничего нет.

<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" integrity="sha512-v2CJ7UaYy4JwqLDIrZUI/4hqeoQieOmAZNXBeQyjo21dadnwR+8ZaIJVT8EE2iyI61OV8e6M8PP2/4hpQINQ/g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

</head>


{% if request.method == 'POST' %}
        <h1>Thank you for your feedback.</h1>
        <h2>If you have provided your contact details, we will be in touch shortly.</h2>
        <p>Your feedback wll be invalvuable to us. In the meantime why not:</p>
        <a href="#" title="Browse our other vacancies">Browse our other vacancies.</a>
        {% else %}
        <h1>Apply for this position</h1>
        <H2>Apply for this position. Please fill this to with the accuracy to the best of your knowledge.</H2>
        <form method="POST" id="post-form" enctype="multipart/form-data">
            {% csrf_token %}

            <!--Form fields-->

            <button type="submit" class="btn btn--primary">Submit</button>
        </form>
       {% endif %}

<script>
    $(document).on('submit', '#post-form', function(e) {
        e.preventDefault();
        $.ajax({
            type:'POST',
            url:"{% url 'careers' %}", <!--Sourced from 'path('',views.careers, name="careers"),' in `urls.py`-->
            data:{
                id_name:$('#id_name').val(),
                id_message:$('#id_message').val(),
                id_email:$('#id_email').val(),
                id_number:$('#id_number').val(), <!--Taken from `<input type="email" name="email" placeholder="Enter your Email" maxlength="320" required="" id="id_email">`-->
                csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val()
            },
        })
    })

</script>

После тестирования я нажимаю кнопку отправки и абсолютно ничего не получаю. Ничего. Не регистрируются сообщения об ошибках, не записываются журналы консоли, просто кнопка отправки полностью превращается в мертвую... неважно что.

Почему?

Почему? Несмотря на наличие Ajax-скрипта, который говорит форме не обновлять страницу при отправке формы, она решает, что будет полностью игнорировать кнопку отправки?

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