Estoy intentado mandar unas respuesta de un formulario, donde ya teniendo la respuesta de la operación en el archivo js
, busco la forma de enviar los datos y actualizarlos en la base de datos de mi app
vía ajax
, he visto muchos tutoriales y documentación, pero no doy con la solución, aquí le pongo mi código:
Archivo HTML:
{% extends "plantillas/base.html" %}
{% block content %}
{% load staticfiles %}
{{ user.numero_empleado}}
<script src="{% static 'js/int.js'%}"></script>
<div><form method="POST" id="demo">
{% csrf_token %}
<h6>Tipo de peticion:{{form.petit}}</h6>
<h6>Razon:{{form.razon}}</h6>
<h6>{{form.solicitudes_id}}</h6>
<h6>Fecha inicio:{{form.periodo_init}}</h6>
<h6>Fecha fin:{{form.periodo_fin}}</h6>
<h6>Introduzca dias a tomar<input id="dias" type="number" name="dias_adicion"></h6>
<h6>Introduzca horas a tomar<input id="horas" type="number" name="horas_adicion"></h6>
<input type="hidden" id="const_dias" name="d_pendientes" value="{{ user.d_pendientes }}">
<input type="hidden" id="const_horas" name="h_pendientes" value="{{ user.h_pendientes }}">
Recuerde, que usted dispone de {{ user.d_pendientes }} dias y
{{ user.h_pendientes }} horas a compensar <br>
<button type="submit" onclick="calculo()" class="boton">Guardar</button>
Donde de ese archivo, mando a llamar el .js
con la siguiente operación:
function calculo()
{
var dias = parseInt(document.getElementById('dias').value);
var horas = parseFloat(document.getElementById('horas').value);
var dias_base = parseInt(document.getElementById('const_dias').value);
var horas_base = parseFloat(document.getElementById('const_horas').value);
dias_base -= dias;
horas_base -= horas;
alert(dias_base);
alert(horas_base);
} console.log(calculo);
$(document).ready(function () {
$("#demo").calculo(function (_calculo) {
$.ajax({
type: "POST",
url: "/solit/",
data: {
'd_pendientes': $('#demo').val(), // from form
'h_pendientes': $('#demo').val() // from form
},
success: function () {
$('#message').html("<h2>Contact Form Submitted!</h2>")
}
});
return false; //<---- move it here
});
Archivo views.py
:
def solit(request):
if request.method == 'POST' and request.is_ajax():
form = addiForm(request.POST)
if form.is_valid():
form.save()
return redirect('index')
form = addiForm()
return render(request, 'plantillas/adicionar.html', {'form':form})
Archivo urls.py
:
urlpatterns = [
path("solit/", solit, name='solit'),
]
O sea, lo que busco es mandar a actualizar los campos de mi modelo haciendo la operación en el frontend
, con js
y el resultado de este mandarlo vía ajax
, sin recargar la pagina a actualizar los datos del user logeado
, cualquier ayuda o comentario, me seria de gran ayuda o si estoy haciendo algo man en uno de los archivos mencionados aquí en la pregunta y muchas gracias por su atención de antemano.