Formulario PHP que carga contenido basado en la opción desplegable

Ya he hecho una pregunta sobre este tema aquí , para un proyecto de cliente. Esas respuestas pueden no ser lo que estoy buscando, así que trataré de hacer esta pregunta lo más detallada posible.

Tengo un formulario que tiene 4 páginas principales. La primera página pide información personal. Al hacer clic en Enviar te lleva a una segunda página. La segunda página tiene una lista desplegable que contiene números de elementos. Digamos que son A, B, C, D, E.

Cuando un visitante elige un artículo y hace clic en Enviar, quiero que la página siguiente muestre el contenido según el elemento elegido anteriormente:

  • Si el visitante elige la opción A, la página debe cargar la página html a.html o la página php a.php .
  • Si selecciona la opción B, la página debe cargar la página html b.html o la página php b.php . Y así sucesivamente para otros artículos, cada uno tiene una página diferente.

No sé PHP en detalle. Estoy construyendo este formulario en un sitio web en WordPress.

Puede solucionar este problema de muchas maneras, pero en este caso recomendaría dos formas: PHP o JS.

Solución 1, PHP

Necesitará

1) Un formulario

2) Un manejador de PHP

 //loadPage.php  

Solución 2, Javascript

Digamos que le gustaría mostrar diferentes páginas sin usar PHP, ¿qué elegir? JavaScript. Esto es, para mí, más fácil de implementar y mucho más “fácil de usar”:

Tarea: mostrar diferentes páginas desde la misma forma

        

Por lo general, es mejor cambiar dinámicamente el contenido haciendo eco de diferentes html, pero esto se puede lograr a través de encabezados.

Solo asegúrate de no enviar NADA antes de las llamadas al encabezado o de que no funcionará correctamente. Ejecutar comandos PHP, etc. está bien, siempre y cuando no se envíe ningún html al cliente antes de hacer su redirección.

 if($_POST['DropDownName'] = 'ValueA') header("Location: a.php"); else // if(POST....) should check just in case. header("Location: b.php"); 

Otra posible solución es usar un iframe para cargar la página siguiente, una ventaja de esto es que puedes hacerlo todo en JS

Puede usar una función AJAX para lograr el resultado mencionado anteriormente. Ahora estamos en la segunda página que tiene un menú desplegable.

  

Y en la propiedad onchange del menú desplegable, estoy llamando a una función de selectpage() AJAX selectpage() , a la que paso el valor seleccionado actualmente de menú desplegable … AS, basado en ese valor, la página apropiada se cargará y se mostrará dentro de la página de presentación div.

 function selectpage(ipp) { if(window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function()//callback fn { if(xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("showpage").innerHTML=xmlhttp.responseText; } } if(ipp=='page_a') { xmlhttp.open("GET","a.php?variable="+ipp,true); } else if(ipp=='page_b') { xmlhttp.open("GET","b.php?variable="+ipp,true); } else if(ipp=='page_c') { xmlhttp.open("GET","c.php?variable="+ipp,true); } else if(ipp=='page_d') { xmlhttp.open("GET","d.php?variable="+ipp,true); } else { xmlhttp.open("GET","e.php?variable="+ipp,true); } // alert(xmlhttp); xmlhttp.send(); } 

Y en esas páginas correspondientes … haga eco de lo que quiera eco.