Question

我在页面上有3个选择，第二个和第三个选择应填充选项，具体取决于在第一个选择中选择的值。例如：第一个选择有一个国家/地区列表，如果我从此选择中选择国家 A ，则第二个选择将填充此国家/地区的城市，第三个选择填充，我不知道，这个国家最受欢迎的名字。

我想通过AJAX实现这一点，但因为该网站是使用Smarty编写的，所以我很难过。每个选择都由一个从php分配的数组填充。我想以某种方式更改第二和第三个数组的值，而不重新加载页面，这取决于我从第一个选择获得的ID。

我尝试请求将值分配给smarty的页面并尝试更改数组，但它在前端中不起作用。有什么想法吗？

修改代码看起来像这样：

$countries = Country::getCountries();
$cities = City::getCities($country_id); //the parameter is not necessary 
$names = Name::getNames($country_id); //the parameter is not necessary 

$smarty->assign("countries",$countrires);
$smarty->assign("cities",$cities);
$smarty->assign("names",$names);
//display template etc

模板页面上的

<select name="countries">
{foreach from=$countries item=country}
   <option value="{$country.id}">{$country.name}</option>
{/foreach}
</select>

和其他2个选项看起来相同。

Answer 1

查看此代码肯定会有所帮助，但我将简要描述您应该采取的过程：

（1）完全按照您在任何可能或不使用的框架内设置任何其他城市页面来设置城市页面。

（2）城市页面的输出模板应如下所示（无标题或包含）：

{foreach $cities as $city} <option value="{$city.id}">{$city.name}</option> {/foreach}

（3）城市页面必须能够接受一些参数来指定我们应该选择城市的国家/地区，例如，使用GET变量。

（4）AJAX调用应该请求带有回调的url（例如，/cities?country=USA）以使用响应替换cities select元素的innerHTML。

（5）没有第5步。

Answer 2

国家选择称为函数，它执行以下操作：

function updateSelect(){     
 var country_id = document.getElementById("country_id").value;
 ajax.requestFile = 'ajax.php?country_id='+sec_id;
 ajax.onCompletion = todo;
 ajax.runAJAX();
}

function todo(){
 var value = eval(ajax.response);
 document.getElementById('city_tr').style.display = 'table-row';
 if (value !=undefined) document.getElementById('td_city').innerHTML = value ;
             else document.getElementById('city_tr').style.display = 'none';
}

ajax.php脚本回显了一个基于它获得的id生成的选择。

用AJAX改变smarty变量的值;多选

2 个答案: