Estoy tratando de encontrar una manera de asignar una fecha que recupero del selector de fecha html estándar y luego asignarla a un modelo de back-end después de hacer clic en un botón de tipo 'enviar'. Soy relativamente nuevo en javascript, así que por favor, sé sincero conmigo. Adjunto están todos los archivos en los que he estado trabajando. ¡Avísame si hay algo más que puedas necesitar de mí para ayudarme con mi pregunta!
verpedidos.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("dropOffDate"); 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>vistas.py
def processDropOffDate(request): data = json.loads(request.body) DropOffDate.objects.create( DropOffDate=data['dropoffDate']['date'], ) return JsonResponse('Drop off date submitted...', safe=False)modelos.py
class DropOffDate(models.Model): DropOffDate = models.DateField() def __str__(self): return str(self.DropOffDate)Simplemente puede usar el siguiente código.
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"), ]vistas.py
def process_drop_off_date(request): date = request.POST.get('date') print(date) # Do, Whatever You Want, Here... return render(request, 'ajax.html')El error provino de un error de ID, publicando una nueva pregunta para obtener más ayuda