Tengo dos formas realmente simples que se ven así:
<form name='a' id='a'> // form a <input type="text" name="x" id="x"> //input 1 <input type="text" name="y" id="y"> //input 2 <button>submit</button> </form>cuando se envía el formulario a, la cadena de consulta de URL se verá como ejemplo.com/?x=1&y=2
<form name='b' id='b' method="POST"> //form b <input type="hidden" name="sum" id="sum"> // hidden input sum </form>Tengo un código de secuencia de comandos de cálculo que calcula la suma de la entrada 1 y la entrada 2 y luego almacena la suma en la "suma de entrada" oculta dentro del "formulario b"
<script> window.addEventListener("DOMContentLoaded", function(){ function calculate(){ // I want it also to work when someone paste the url example.com/?x=1&y=2 const urlParams = new URLSearchParams(window.location.search); x = urlParams.get('x') y = urlParams.get('y') sum = parseInt(x)+parseInt(y) document.getElementById('sum').value = sum //store sum to hidden input } calculate() }); </script>¿Cómo envío el valor de la "suma de entrada" oculta al backend (Django) cuando alguien envía un formulario o pega la URL?
Prefiero algo como esto si tal cosa es viable:
if sum.value not empty: form_b.submit() form_b.prevent_page_refreshNo sé si esto es posible o cómo implementarlo en js o ajax, si no, estoy abierto a todas las ideas.
Editar: solución Ajax justo después de la función def calcular () {...}, y eliminó la segunda forma:
$.ajax({ type:'POST', url:'{% url "index"%}', headers: { 'X-CSRFToken': '{{ csrf_token }}' }, data:{ sum:sum, }, success: function(){}});No estoy seguro de entender tu punto exactamente, pero creo que esto es lo que estás buscando.
const form = document.getElementById('a'); const sumInput = document.getElementById('sum'); function calculate() { const urlParams = new URLSearchParams(window.location.search); x = urlParams.get('x'); y = urlParams.get('y'); const sum = parseInt(x) + parseInt(y); sumInput.value = sum; fetch('http://localhost:8000', { method: 'POST', body: JSON.stringify({ value: sum }) }); } window.addEventListener("DOMContentLoaded", () => { calculate() }); <form name="a" id="a" onsubmit="calculate"> <input type="text" name="x" id="x"> <input type="text" name="y" id="y"> <button>submit</button> <input type="hidden" name="sum" id="sum"> </form>Básicamente, ¿un formulario simple que calcula el resultado y lo publica? Entonces, no estoy seguro de qué sirve para la entrada oculta.