我有下面的代码显示2个下拉列表,一个用于区域,并且基于所选选项,第二个下拉列表(城市)将更改并仅显示所选区域中的城市。
此代码可以正常工作,除了一个问题 - 当您选择区域或区域+城市并应用选择时,页面刷新并获得包含结果的新页面(来自osclass.org脚本),选择失败。
所以,这里的一个重要问题是,当页面刷新时,我如何保持区域/城市的选择。
<form class="form-inline" role="form" action="<?php echo osc_base_url(true) ; ?>" method="get" class="nocsrf">
<input type="hidden" name="page" value="search" />
<h3><strong><?php _e('Location', 'theme'); ?></strong></h3>
<h6><?php _e('Region', 'theme'); ?></h6>
<?php ItemForm::region_select(osc_get_regions(osc_user_country()), osc_user()); ?>
<h6><?php _e('City', 'theme'); ?></h6>
<select id="sCity" name="sCity" >
<option value="">Any City</option>
</select>
<button type="submit" class="btn btn-primary">
<?php _e('Search', 'twitter') ; ?>
</button>
这是填充城市选择的代码
$('#regionId').change(function updateCityList() {
var actualRegionId = $(this).val();
if ( Math.floor(actualRegionId) == actualRegionId && $.isNumeric(actualRegionId)) {
/*Get cities per region*/
$.ajax({
url: "<?php echo osc_base_url(true); ?>?page=ajax&action=cities",
data: { regionId: actualRegionId },
success: function( cities, err){
var $el = $("#sCity"),
citiesOptions = {};
$('#sCity option:gt(0)').remove();
$el.val("");
$el.prev("span").text("Any City");
$.each(cities, function(key, value) {
$el.append($("<option></option>")
.attr("value", value.s_name).text(value.s_name));
});
$("#sRegion").attr("value", $("#regionId option[value='"+actualRegionId+"']").text());
},
dataType: "json"
});
}
});