Получение значения даты и присвоение даты бэкенду Django

Я пытаюсь найти способ присвоить дату, которую я извлекаю из стандартного html date picker, и затем присвоить ее бэкенд-модели после нажатия кнопки типа 'submit'. Я написал несколько javascript, но значение продолжает извлекаться как NULL. Я относительно новичок в javascript, поэтому прошу не обижаться на меня. Прилагаю все файлы, над которыми я работал, а также скриншоты ошибки. Пожалуйста, дайте мне знать, если есть что-то еще, что вам может понадобиться, чтобы помочь мне с моим вопросом!

vieworders.html

<div class="row mb-4">
    <label for="start">Drop Off Date Selector:</label>
    <br>
    <input type="date" id="dropOffDate"
        min="2022-01-01" max="3000-12-31">
        <button type="submit" value="Continue" class="btn btn-outline-danger" id="submit-drop-off-date">Submit Drop Off Date</button>
</div>

<script type="text/javascript">
    var date = document.getElementById("date");

    date.addEventListener('submit', function(e){
        e.preventDefault()
        submitDropOffData()
        console.log("Drop off data submitted...")
    })
        function submitDropOffData() {
            var dropOffDateInformation = {
                'dropOffDate':null,
            }

            dropoffDate.date = date.value

            var url = "/process_drop_off_date/"
            fetch(url, {
                method:'POST',
                headers:{
                    'Content-Type':'application/json',
                    'X-CSRFToken':csrftoken,
                }, 
                body:JSON.stringify({'dropoffDate':dropOffDateInformation}),
                
            })
        .then((response) => response.json())
            .then((data) => {
                console.log('Drop off date has been submitted...')
                alert('Drop off date submitted');
                window.location.href = "{% url 'home' %}"
                })
        }
</script>

views.py

def processDropOffDate(request):
    data = json.loads(request.body)

    DropOffDate.objects.create(
        DropOffDate=data['dropoffDate']['date'],
    )

    return JsonResponse('Drop off date submitted...', safe=False)

models.py

class DropOffDate(models.Model):
    DropOffDate = models.DateField()

    def __str__(self):
        return str(self.DropOffDate)

Информация об ошибке

ErrorError Expanded

Ошибка произошла из-за ошибки ID, размещаю новый вопрос для дальнейшей поддержки

Вы можете просто использовать следующий код.

ajax.html

<div class="row mb-4">
    <label for="start">Drop Off Date Selector:</label>
    <br>
    <input type="date" id="dropOffDate"
           min="2022-01-01" max="3000-12-31">
    <button type="submit" value="Continue" class="btn btn-outline-danger" id="submit-drop-off-date">Submit Drop Off
        Date
    </button>
</div>


<script type="text/javascript">
    $(document).on('click', '#submit-drop-off-date', function (e) {
        e.preventDefault();
        let date = $('#dropOffDate').val();
        console.log(date);
        $.ajax({
            type: 'POST',
            url: "{% url 'process_drop_off_date' %}",
            async: true,
            data: {
                date: date,
                csrfmiddlewaretoken: '{{ csrf_token }}'
            },
            success: function (values) {
                console.log("Date Has Been Submitted");
            },
            error: function () {
                console.log("Some Error Occured");
            },
        });

    })
</script>

urls.py

from django.urls import path
from . import views


urlpatterns = [
    path('process_drop_off_date/', views.process_drop_off_date, name="process_drop_off_date"),
]

views.py

def process_drop_off_date(request):
    date = request.POST.get('date')
    print(date)
    # Do, Whatever You Want, Here...
    return render(request, 'ajax.html')
Вернуться на верх