与第二下拉选择相关的第二下拉选择

Question

I want to create a signup form, that its values will be stored in a database (mysql). 我想创建一个注册表单，将其值存储在数据库（mysql）中。 Because i want the data to be in the correct format (New York instead of NY when asking for City) i am thinking in limiting the options using a drop down list. 因为我希望数据采用正确的格式（要求输入City时使用纽约而不是NY），所以我在考虑使用下拉列表限制选项。 For example, when a user selects as a Country: UK, the second selection to narrow down to the cities inside UK and remove the rest cities of the world. 例如，当用户选择“国家/地区：英国”时，第二个选择将范围缩小到英国境内的城市，并删除世界上其余的城市。

Can i do this with only PHP/HTML/MYSQL knowledge? 我可以仅使用PHP / HTML / MYSQL知识来做到这一点吗？ Or do i need to know Javascript/Jquery and more? 还是我需要了解Javascript / Jquery等？

Thanks in advance. 提前致谢。

Answer 1

The best approach is to use jQuery (javascript) to manage the interaction with the server (this process is known as AJAX). 最好的方法是使用jQuery（javascript）管理与服务器的交互（此过程称为AJAX）。

First, jQuery is just a javascript library that makes it TONS easier to use javascript. 首先，jQuery只是一个JavaScript库，使TONS易于使用javascript。 Here is an interesting article about why jQuery is absolutely necessary. 这是一篇关于为什么jQuery绝对必要的有趣的文章。 However, the two main reasons to use jQuery are: (1) cross-browser is done for you, and (2) waaaaaay less typing. 但是，使用jQuery的两个主要原因是：（1）为您完成了跨浏览器的操作，以及（2）打字少了。 Here are some great FREE resources for learning jQuery: 这里有一些免费的学习jQuery的免费资源：

theNewBoston.com theNewBoston.com
phpAcademy.org phpAcademy.org

Next, when using jQuery, you must first load the jQuery library. 接下来，在使用jQuery时，必须首先加载jQuery库。 After that, you can type jQuery commands instead of javascript and much magic happens much easier. 在那之后，您可以键入jQuery命令而不是javascript，发生很多魔术就容易得多。 Load the library like this, in your head tags: 这样在您的head标签中加载库：

<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>

Finally, look here for populating Select #2 based on results from Select #1: 最后，根据选择＃1的结果在此处填充选择＃2：

Populate Select2 based on Select1, from MySQL DB 从MySQL DB中基于Select1填充Select2

Populate dropdown 2 based on selection in dropdown 1 根据下拉列表1中的选择填充下拉列表2

Answer 2

You could do it with only PHP/HTML/MYSQL, but, it would impact the user experience as you'd have to do something like this: 您可以只使用PHP / HTML / MYSQL来做到这一点，但是，这将影响用户体验，因为您必须执行以下操作：

1) present form with the country dropdown menu. 1）使用国家/地区下拉菜单显示表单。 get user submission and send back to server (via POST, PUT, GET) 获取用户提交并发送回服务器（通过POST，PUT，GET）

2) receive the user input and then present filtered cities in second dropdown menu. 2）接收用户输入，然后在第二个下拉菜单中显示已过滤的城市。 now the user can select the city and POST to your server. 现在，用户可以选择城市并过帐到您的服务器。

Answer 3

You can do it with PHP, but not dynamic. 您可以使用PHP来实现，但不能动态。 People will have to select United Kingdom first, then press submit, and proceed to select a city. 人们将必须首先选择英国，然后按提交，然后选择一个城市。

You can, however, do it dynamic. 但是，您可以动态进行。 You can use Ajax to do this properly: 您可以使用Ajax正确执行此操作：

The HTML: HTML：

<select name="country" id="country" onchange="getCities(this.value)">
 <option>Brazil</option>
 <option>United Kingdom</option>
</select>

<select name="city" id="city">
 <option disabled selected>Please select a country first</option
</select>

The Javascript: Javascript：

function getCities(str) {
 if (str=="") {
  document.getElementById("city").innerHTML="";
  return;
 } if(window.XMLHttpRequest) {  // code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
 } else {   // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 } xmlhttp.onreadystatechange=function() {
 if(xmlhttp.readyState==4 && xmlhttp.status==200) {
  document.getElementById("hat").innerHTML=xmlhttp.responseText;
 }
}
 xmlhttp.open("GET","getcities.php?q="+str,true);
 xmlhttp.send();
}

In getcities.php you'd get all the relevant cities, and output them as <option>city_name</option . 在getcities.php您将获得所有相关的城市，并将它们输出为<option>city_name</option 。

Answer 4

You can easily do it by jquery ajax. 您可以通过jquery ajax轻松实现。

First populate dropdown for country like this: 首先填充国家的下拉列表，如下所示：

$sql = "select * from country";
$result = //execute your query and fetch array

run a loop through $result and inside loop 通过$result和内部循环运行一个循环

echo "<option value=".$row['id'].">".$row['name']."</option>";

after that you need to call ajax on chaging this dropdown like this: 之后，您需要在调用此下拉列表时调用ajax，如下所示：

$("#your_dropdown_id").change(function(){
     $.ajax({
        url: "ajax.php?id="+$(this).val(),
        success: function(data) {
            $("#second_dropdown_id").html(data);
        }
    })
})

I have tried to give you basic idea. 我试图给你基本的想法。

See details : http://www.appelsiini.net/2010/jquery-chained-selects 查看详细信息： http : //www.appelsiini.net/2010/jquery-chained-selects

How to make cascading drop-down lists using mysql and php 如何使用mysql和php进行级联下拉列表

与第二下拉选择相关的第二下拉选择

问题描述

4 个解决方案

解决方案1
1 已采纳 2014-01-11 23:04:58

解决方案2
0 2014-01-11 19:10:27

解决方案3
0 2014-01-11 19:13:04

解决方案4
0 2014-01-11 19:24:23

与第二下拉选择相关的第二下拉选择

问题描述

4 个解决方案

解决方案1 1 已采纳 2014-01-11 23:04:58

解决方案2 0 2014-01-11 19:10:27

解决方案3 0 2014-01-11 19:13:04

解决方案4 0 2014-01-11 19:24:23

解决方案1
1 已采纳 2014-01-11 23:04:58

解决方案2
0 2014-01-11 19:10:27

解决方案3
0 2014-01-11 19:13:04

解决方案4
0 2014-01-11 19:24:23