Bien, de tanta prueba y error llegué a esto:
Código:
Aquí un enlace para que vean la práctica funcionando.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="es"> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <title>formulario dinamico</title> <style type="text/css"> body{font-family:Arial; font-size:18px;} #content{overflow:hidden;} #uno{width:40%; padding:10px; float:left; background-color:#eaeaea;} #dos{width:40%; padding:10px; float:left; background-color:#ccc;} .radio:hover{cursor:pointer;} </style> <script type="text/javascript"> function cambiaNroPags (elem) { // ingresa el nuevo valor var elemento = document.getElementById('paginas'); elemento.value= elem;// aca elemento es el text y elem el radio. el input text toma el valor del imput radio } function cambiaNroDias (elem) { var elemento = document.getElementById('dias'); elemento.value= elem; } </script> </head> <body> <div ="content"> <div id="uno"> <form id="formulario" action="trabajo.php" method="post"> <p>¿Cuantas páginas?</p> <input name="paginas" id="paginas" type="text" value="1"/> <input id="radiop1" type="radio" name="nroPag" value="1" class="radio" onclick="javacript:cambiaNroPags(document.getElementById('radiop1').value)"/> <input id="radiop2" type="radio" name="nroPag" value="2" class="radio" onclick="javacript:cambiaNroPags(document.getElementById('radiop2').value)"/> <input id="radiop3" type="radio" name="nroPag" value="3" class="radio" onclick="javacript:cambiaNroPags(document.getElementById('radiop3').value)"/> <p>¿Cuantos días?</p> <input name="dias" id="dias" type="text" value="3" /> <input id="radiod1" type="radio" name="nroDia" value="1" class="radio" onclick="javacript:cambiaNroDias(document.getElementById('radiod1').value)"/> <input id="radiod2" type="radio" name="nroDia" value="2" class="radio" onclick="javacript:cambiaNroDias(document.getElementById('radiod2').value)"/> <input id="radiod3" type="radio" name="nroDia" value="3" class="radio" onclick="javacript:cambiaNroDias(document.getElementById('radiod3').value)"/> </form> </div> <div id="dos"> <p>en este div va la suma <br> <a href="http://w3-markup.com/order#details" target="_blanck">aquí</a> el sitio que intento imitar</p> </div> </div> </body> </html>
Bien, al grano:
¿Como puedo hacer que, por ejemplo, el radiobutton al que di un value="1" luego tome digamos un valor de 150, logrando que este valor me quede disponible para, luego, junto a los demás valores (de los demás radiobutton) poder hacer la suma y presentar la misma en el div de la derecha?
Espero me entiendan sino me explico nuevamente.
Cualquier pista me biene bien ya que por más manuales y tutoriales que leo, por ser nuevo solo consigo meter teoría en mi cabeza y me falta práctica con js, lo que me interesa muchísimo adquirir.
Un saludo!