Javascript-запрос к Python Django не найден

Я новичок в Django и Javascript. Теперь полностью застрял с этой ошибкой, возможно, это действительно мелочь, но я не могу понять, в чем может быть проблема.

Я хочу удалить документ через форму с помощью Javascript и отправить его в бэкенд Django через запрос. В терминале я получаю следующее сообщение об ошибке:

"Not Found: /delete_document/7/
[23/Feb/2024 13:26:53] "DELETE /delete_document/7/ HTTP/1.1" 404 2371"

Цвет запроса желтый, и все происходит так, как я вижу, он просто не может найти мою функцию просмотра.

views.py

@require_http_methods(['DELETE'])
def delete_document(request, document_id):
    document = get_object_or_404(Document, pk=document_id)
    document.delete()
    return JsonResponse({'message': 'Document deleted successfully'}, status=204)

urls.py

from django.urls import path

from . import views

# Define namespace
app_name = 'advice'

urlpatterns = [
    ...
    path('delete_document/<int:document_id>/', views.delete_document, name='delete_document'),
]

index.html соответствующие части

    <form id="documentForm" action="" method="post" data-base-action="{% url 'advice:gpt_base' %}">
        {% csrf_token %}
        <input type="hidden" name="firstQuestion" value="True">
        <select id="documentSelect" class="form-select" aria-label="Select form">
            <option selected>Select a file</option>
            {% for document in documents %}
                <option value="{{ document.id }}">{{ document.title }}: {{ document.uploaded_file.url }}</option>
            {% endfor %}
        </select>
        <button type="button" class="btn btn-danger" id="deleteButton">Delete</button>
        <br>
        <button type="submit" class="btn btn-primary">Submit</button>
    </form>
    <script>
        document.getElementById('deleteButton').addEventListener('click', function() {
            var selectedDocumentId = document.getElementById('documentSelect').value;
            if (selectedDocumentId === 'Select a file') {
                alert('Please select a document to delete.');
            } else {
                if (confirm('Are you sure you want to delete this document?')) {
                    fetch(`/delete_document/${selectedDocumentId}/`, {
                    method: 'DELETE',
                    headers: {
                        'X-CSRFToken': document.querySelector('input[name="csrfmiddlewaretoken"]').value
                    }
                })
                    .then(response => {
                        if (response.ok) {
                            // Reload the page to reflect changes
                            window.location.reload();
                        } else {
                            console.error('Failed to delete document');
                        }
                    })
                    .catch(error => console.error('Error:', error));
                }
            }                
        });
    </script>
    <script>
        document.getElementById('documentSelect').addEventListener('change', function() {
            var selectedDocumentId = this.value;
            var form = document.getElementById('documentForm');
            var baseAction = form.getAttribute('data-base-action');
            form.action = baseAction + selectedDocumentId + '/';
        });
    </script>

Все работает нормально, кроме кнопки Delete из-за этой ошибки. Пожалуйста, помогите мне решить эту проблему. Заранее спасибо!

Я пытался удалить документ в форме, отправляя запрос с Javascript, это привело к ошибке в терминале с сообщением об ошибке выше. Пытался решить это всеми возможными способами, ChatGPT не нашел ошибок в коде и показался хорошей реализацией для этого.

Я только что обнаружил эту крошечную ошибку. В части fetch я должен был заменить: fetch(/delete_document/${selectedDocumentId}/ на fetch(delete_document/${selectedDocumentId}/ и убрать "" из начала url.

Извините за длинный пост... :)

Ps: Я надеюсь, что это поможет другим выделить 2 часа, у кого есть подобная проблема

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