Я уже задал вопрос по этой проблеме здесь , для клиентского проекта. Эти ответы могут быть не такими, что я ищу, поэтому я постараюсь сделать этот вопрос максимально подробным.
У меня есть форма, которая имеет 4 основные страницы. На первой странице запрашивается личная информация. При нажатии на кнопку «Отправить» вы попадаете на вторую страницу. Вторая страница имеет раскрывающийся список, содержащий номера позиций. Предположим, что они A, B, C, D, E.
Когда посетитель выбирает элемент и нажимает кнопку «Отправить», я хочу, чтобы следующая страница показывала контент на основе элемента, выбранного выше:
Я не знаю PHP в деталях. Я создаю эту форму на веб-сайте WordPress.
Вы можете обойти эту проблему разными способами, но в этом случае я бы рекомендовал два способа: PHP или JS.
Тебе понадобится
1) Форма
<form action="loadPage.php" method="POST" name="theForm" id="theForm"> <select form="theForm" name="selectedPage"> <option value="page_1">Page 1</option> <option value="page_2">Page 2</option> ... </select> <input type="submit" value="Load page" /> </form> 2) Обработчик PHP
//loadPage.php <?php $requested_page = $_POST['selectedPage']; switch($requested_page) { case "page_1": header("Location: page_1.php"); break; case "page_2": header("Location: page_2.php"); break; default : echo "No page was selected"; break; } ?>
Предположим, что вы хотите отображать разные страницы без использования PHP, тогда что выбрать? JavaScript. Это для меня более легко реализовать и гораздо более «удобное»:
Задача: отображение разных страниц одной и той же формы
<!DOCTYPE html> <html> <head> <!-- Amazing stuff goes here :) --> <script> function load_page() { var selected_page = document.getElementById("selected_page").value; if (selected_page != "") { window.location.href = selected_page //Please note that the value recived, //in this case selected_page, //should be a valid url! //Therefore the value of the //<option> tag should be itself //a url ! //ex.: <option value="page.php"> is valid //<option value="page_1"> is not valid } } </script> </head> <body> <form action="#"> <select id="selected_page"> <option value="page_1.php">Page 1</option> <option value="page_2.php">Page 2</option> ... </select> <button onclick="load_page()">Load it ! </button> </form> </body> </html>
Обычно лучше динамически изменять контент с помощью эхо-сигнала другого html, но это может быть достигнуто с помощью заголовков.
Просто убедитесь, что ничего не выдали ни перед чем, заголовок вызывает, либо он не будет работать должным образом. Запуск PHP-команд и т. Д. Хороши, пока html не отправляется клиенту, прежде чем вы будете перенаправлять.
if($_POST['DropDownName'] = 'ValueA') header("Location: a.php"); else // if(POST....) should check just in case. header("Location: b.php");
Другим возможным решением является использование iframe для загрузки следующей страницы, одно из преимуществ этого заключается в том, что вы можете сделать все это в JS
Вы можете использовать функцию AJAX для достижения вышеупомянутого результата. Теперь мы находимся на второй странице с раскрывающимся меню.
<select name="selectpageddl" class="form-control" onchange="selectpage(this.value)"> <option value="page_a" selected="selected">A</option> <option value="page_b" selected="selected">B</option> <option value="page_c" selected="selected">C</option> <option value="page_d" selected="selected">D</option> <option value="page_e" selected="selected">E</option> </select> <div id="showpage"></div>
И в свойстве onchange выпадающего списка я selectpage() функцию selectpage() AJAX, к которой я selectpage() текущее выбранное значение из раскрывающегося списка … SO на основе этого значения, соответствующая страница будет загружена и показана внутри шоу-страницы дела.
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(); }
И в тех, что соответствуют, страницы ….. эхо все, что вы хотите эхо.