Pues estoy haciendo un curso de programacion web y ahora estoy haciendo un ejercicio de javascript donde se me plantea hacer lo siguiente:
En esta página pondremos un formulario en el que se deben rellenar una serie
de campos. Para generar un presupuesto estimado, dentro del campo ‘Tipo de
página’ pondremos tres o cuatro con diferentes precios base (inventados), a los
que habrá que restarle un 5% por cada mes de plazo que tengamos para entregar
la web (máximo 20%). Por último, sumaremos 400 Euros extra por cada
casilla marcada de secciones.
Todo ello debe ir actualizando el campo de presupuesto con cualquier cambio y
sin refrescar la web.
Estoy atascado, mas o menos tengo la idea de como hacerlo, al cambiar algo de formulario, mediante evento onclick u onchange según, llame a una función para chequear.
Por ejemplo dentro del grupo tipo de webs, si ya hay alguna seleccionada, la borre de la variable total y añada la nueva.
En el grupo de plazos, seria mediante un document.getElementById coger el value y descontarle a total el % que le corresponde segun los plazos.
Y luego en los extras, sumarle a la variable total 400€ cuando se selecciona una y restarle cuando se quitan.
el campo presupuesto se irá actualizando sin refrescar la pagina, con document.getElementById seria lo suyo.
El caso es que no arranco, y lo básico que hago para ir tanteando la jugada me sale mal.
Por ejemplo estoy haciendo una prueba, de actualizar sin refrescar, con un ejemplo que no tiene nada que ver con el ejercicio y no me sale.
<html>
<head>
<title>Titulo</title>
<script type="text/javascript">
total = 0;
function comprobar(x) {
if (x == 1) {
total = total + document.getElementById("1").value;
document.getElementById("resultado").value = parseInt(total);
}
else if (x == 2) {
total = total + document.getElementById("2").value;
document.getElementById("resultado").value = parseInt(total);
}
else if (x == 3) {
total = total + document.getElementById("3").value;
document.getElementById("resultado").value = parseInt(total);
}
}
</script>
</head>
<body>
<input type="textbox" id="1" onchange="comprobar(this.id)">
<input type="textbox" id="2" onchange="comprobar(this.id)">
<input type="textbox" id="3" onchange="comprobar(this.id)">
<input type="textbox" id="resultado">
</body>
</html>
En el resultante de ese ejemplo, si en el primer campo escribo 1 y en el segundo escribo 2, el campo con id resultado me da 10, cuando deberia de dar 3 segun mi intencion xd
Eso es solo un ejemplillo para yo ir tanteando la jugada, pero mal empezamos.
Igualmente pido ayuda para ver si alguien tiene alguna otra manera mejor de razonar el ejercicio, yo como digo lo haria con condiciones if/else pero se me está haciendo engorroso y no me sale.
Gracias de antebrazo.