1

Soy algo nuevo con el código Html así que me gustaría pediros un poco de ayuda.

Tengo 3 listas con opciones, encadenadas entre ellas mediante funciones de JavaScript, para mostrar opciones según la opción que elijas. Mi intención es, que después de elegir la opción en la 3 lista, me salga un formulario para rellenar.

  1. ¿Cómo gestiono esto? ¿Tengo que poner los labels y los inputs type en hidden y luego con una función en JavaScript mostrarlos? Si alguien pudiera hacerme un ejemplo estaría agradecido.

  2. La otra opción que quiero, es que los labels no sean estaticos. Es decir, si para una opción el primer campo necesito un nombre, el label pondra "nombre" pero para la segunda, quiero que el label que salga sea "Email". Si se pudieran cambiar las id también sería un puntazo.

Voy a poner el código que tengo.

Formulario que quiero mostrar:

<form id="formulario">
<label for ="nombre"></label>
<input type ="text" name = "nombre" id ="nombre" placeholder="Introduce tu nombre"></br>

<label for="asunto"></label>
<input type="text" name="Asunto" id="asunto" placeholder="Asunto"></br>

<label for="asunto"></label>
<input type="text" name="Correo" id="correo" placeholder="Correo para recibir respuesta"></br>

<label for="mensaje"></label>
<textarea name="mensaje" id="mensaje" cols="30" rows="10" placeholder= "Escribe tu consulta"></textarea>
<br>
<a HREF="mailto:xxxxxxxxxxxxxxxx?subject"> <input type="submit"> </a>
</form>

Quiero que este formulario se muestre y cambien los labels cuando llegue aquí. Ya llamo a esta función cuando escojo la 3º opción.

<script type="text/javascript">
	function mostrarformulario(id){
		var a = document.getElementById("lista3").value;
		if (a == "Alta usuario")
			{
			}
}
</script>

Muchas gracias a todos.

2
  • Hola David, bienvenido a StackOverflow. Para que alguien pueda echarte una mano con tu problema es necesario que muestres el código con lo que tienes hecho, puedes editar tu pregunta y añadirlo. Si no conoces como funciona el sitio te recomiendo leer Cómo preguntar y hacer el recorrido de bienvenida.
    – Ferni
    el 13 jul. 2018 a las 7:00
  • Voy a ello. Muchas gracias.
    – David_helo
    el 13 jul. 2018 a las 7:04

1 respuesta 1

0

Si tienes el formulario en la página y está oculto por css con 'style="display: none;"', lo puedes mostrar con JQuery

function mostrarformulario(id){ 
  $("#formulario").show(); 
}

o JavaScript

function mostrarformulario(id){ 
  document.getElementById("formulario").style.display = "block";
}

Otra opción es tener el formulario en otro archivo y traerlo por ajax, para eso lo que tendrías es un div dentro del cual vas a poner el formulario.

function mostrarformulario(id){
  $.ajax({ 
        url: 'url donde está el form',
        data: { datos si necesitas enviar al form para mostrar },
        success: function(data) { 
            $('#midiv').html(data);         
        }
    });
}
7
  • No lo tengo oculto en css. Como lo implemento? Esta dentro de un <section id="main"> , <div class = "contenedor", <form id = formulario >. ¿Como tengo que declararlo en css? ¿Así? .contenedor #formulario{ display: none; }
    – David_helo
    el 13 jul. 2018 a las 8:16
  • <form id="formulario" style="display: none;"> directamente o creas una clase en tu archivo css con este estilo y la aplicas en la etiqueta.
    – Carmen
    el 13 jul. 2018 a las 8:22
  • No me acaba de funcionar. La parte de esconder si que funciona, pero la parte de mostrar no se porque. No me muestra ningun error mi editor.
    – David_helo
    el 13 jul. 2018 a las 8:53
  • Lo tengo!!! El error es que formulario en "JavaScript" debe de ir así 'formulario' (entre comillas simples). Muchas gracias!
    – David_helo
    el 13 jul. 2018 a las 9:02
  • Es verdad, se me fueron las comillas, sorry
    – Carmen
    el 13 jul. 2018 a las 9:11

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.