我需要刷新页面,并根据第一个下拉列表中选择的值填充第二个下拉列表。
- 在PHP中,我选择下拉值。它调用Javascript函数reloadproject()并用当前值重新加载页面
- 然后我使用$_get获得项目id的值
- 重新加载后,我需要使用$_GET获得的项目id调用函数getblock(val),并填充我的第二个下拉列表
function reloadproject(val) {
window.location = 'market?id=' + val;
}
function getblock(val) {
$.ajax({
type: "POST",
url: "list_flat_view_dd.php",
data: 'project_id=' + val,
success: function(data) {
$("#block-list").html(data);
}
});
}
function getflat(val) {
$.ajax({
type: "POST",
url: "list_flat_view_dd.php",
data: 'block_id=' + val,
success: function(data) {
$("#flat-list").html(data);
}
});
}
<div class="col-sm-3">
<select name="project" style="width: 100%;" id="project-list" class="form-control select2"
onChange="reloadproject(this.value);">
<option value="all">Select</option>
<?php while ( $project=m ysqli_fetch_array ( $results_project ) ) { ?>
<option value="<?php echo $project[" id "]; ?>"<?php if(isset($_GET[ 'id'])){if($project[ "id"]==$ filter_project_id){ ?>selected="selected"
<?php }} ?>>
<?php echo $project[ "name"]; ?>
</option>
<?php } ?>
</select>
<?php if(isset($_GET[ 'id'])){ ?>
<input type="hidden" name="filter_project_id" id="filter_project_id" value="<?php echo $filter_project_id; ?>">
<?php } ?>
</div>
<div class="col-sm-3">
<select name="block" style="width: 100%;" id="block-list" class="form-control select2" onChange="getflat(this.value);">
<option value="all">Select</option>
</select>
</div>
<div class="col-sm-3">
<select name="flat" style="width: 100%;" id="flat-list" class="form-control select2" onChange="">
<option value="all">Select</option>
</select>
</div>
您是否尝试过使用"document ready"来调用"getblock"函数?:
PHP首先运行:打印文档中的代码,然后使用jQuery$(document).ready(),您就知道文档已经打印好了,并且已经有了GET['id']值的隐藏输入:
<input type="hidden" name="filter_project_id" id="filter_project_id" value="<?php echo $filter_project_id; ?>">
还有你的脚本:
$(document).ready(function() {
if ($('#filter_project_id').val().length) {
getblock($('#filter_project_id').val());
}
});
首先,dropbox重新加载页面,并使用$_GET启用另一个具有项目id的输入框,这将调用ajax和jquery函数来填充第二个dropbox,而无需重新加载。
function reloadproject(val){
window.location='market?id='+val;
}
$(function() {
if ($('#filter_project_id').val().length) {
var project_id = $("#filter_project_id").val();
if (project_id) {
$.ajax({
type: "POST",
url: "list_flat_view_dd.php",
data: 'project_id=' + project_id,
success: function(data) {
$("#block-list").html(data);
}
});
}
}
});
<div class="col-sm-3">
<select name="project" style="width: 100%;" id="project-list" class="form-control select2" onChange="reloadproject(this.value);">
<option value="all">Select</option>
<?php while ( $project=m ysqli_fetch_array ( $results_project ) ) { ?>
<option value="<?php echo $project[" id "]; ?>"<?php if(isset($_GET[ 'id'])){if($project[ "id"]==$ filter_project_id){ ?>selected="selected"
<?php }} ?>>
<?php echo $project[ "name"]; ?>
</option>
<?php } ?>
</select>
</div>
<?php if(isset($_GET[ 'id'])){ ?>
<input type="hidden" name="filter_project_id" id="filter_project_id" value="<?php echo $filter_project_id; ?>">
<?php } ?>
<div class="col-sm-3">
<select name="block" style="width: 100%;" id="block-list" class="form-control select2" onChange="getflat(this.value);">
<option value="all">Select</option>
</select>
</div>