从另一个选择框中动态填充选择框的值
问题描述：
我有两个选择选项Countries和States。使用php函数从数据库填充选项值。我想填充States，具体取决于Countries的选择。例如，如果我从Countries中选择美国，那么States选择选项将填充属于美国国家的所有States。从另一个选择框中动态填充选择框的值
这里是我的代码 -
<select id="countryName" name="countryName" onChange="getCountryCode()">
<option value=""></option>
<?php $countries = $location->getCountries();
foreach ($countries as $country) {
echo '<option value="' . $country->id . '">' . $country->name . '</option>';
}
?>
</select>
我可以使用所选国家的值javascript功能
<script type="text/javascript">
function getCountryCode(){
var countryCode = document.getElementById('countryName').value;
}
</script>
毕竟这些，我试图使用PHP来获得选择Country的States功能getStates($countryCode)。但我不知道如何将javascript变量传递给php函数。
<select name="stateName">
<option value=""></option>
<?php $states = $location->getStates($countryCode);
foreach ($states as $state) {
echo '<option value="' . $state->id . '">' . $state->name . '</option>';
}
?>
</select>
没有人有任何想法我如何通过JavaScript变量到PHP或者有更好的主意比这，请不要的份额。
谢谢！
答
目前，您将JavaScript代码（客户端）与PHP代码（服务器端）混合使用。这是不可能的。将内容发送到浏览器后，php必须等待，直到用户再次调用服务器的某个操作。就你而言，有两种可能的解决方案。
- 使用AJAX从服务器获取状态选择框的内容。的一种方法是一个简单的PHP脚本，它只是打印状态：
PHP脚本
$states = $location->getStates($_GET['state']);
foreach ($states as $state) {
echo '<option value="' . $state->id . '">' . $state->name . '</option>';
}
的Javascript（使用jQuery）
$('#countryName').on('change', function() {
$.ajax({
url: 'states.php',
data: { state: $(this).val() },
type: 'GET',
success: function(data) {
$('select[name="stateName"]').html(data);
}
});
});
- 没有ajax的另一个解决方案是始终打印所有状态并显示/隐藏它们与您所在国家/地区的值相关
PHP脚本
$states = $location->getAllStates();
foreach ($states as $state) {
echo '<option data-country="{$state->country}" value="{$state->id}">{$state->name}</option>';
}
的JavaScript（使用jQuery）
$(function() {
var $statesSelect = $('select[name="stateName"]');
var $states = $('option', $statesSelect);
// first remove all elements from dom
$states.detach();
// and then listen to change event and show/hide them
$('#countryName').on('change', function() {
var val = $(this).val();
$('option', $statesSelect).detach();
$states.each(function() {
$(this).is('[data-country="' + val + '"').appendTo($statesSelect);
});
});
});
您应该使用Ajax为，结合它调用一个'。对（ '变'）'事件。 – doutriforce
感谢您的意见，你介意与一些例子分享。对不起，但我不擅长JavaScript或Ajax。 –
我建议通过阅读https://stackoverflow.com/questions/13840429/what-is-the-difference-between-client-side-and-server-side-programming它也有一个参考另一篇文章https://stackoverflow.com/questions/23740548/how-to-pass-variables-and-data-from-php-to-javascript/23741119这应该让你到终点线。 –