2017-09-25 172 views
0

我有两个选择框。选择重新加载并更改其他选择框的值

Select Room Type 
Select Room No. 

这里是PHP代码:

<select id="room_type" name="room_type" class="form-control"> 
<?php 
$selected = $row['room_type']; 
while($result = mysqli_fetch_array($getroomtypes)){ ?> 
<option value="<?php echo $result['id'];?>" > <?php echo $result['type'];?> </option> 
<?php 
} 
?> 
</select></div> 
</div> 

<div class="form-group"> 
<label class="control-label col-sm-2">Select Room</label> 
<div class="col-sm-5"> 
<select id="room" name="room" class="form-control"> 
<?php 
$selected = $row['room']; 
while($result = mysqli_fetch_array($getroom)){ ?> 
<option value="<?php echo $result['id'];?>"> <?php echo $result['room'];?> </option> 
<?php 
} 
?> 
</select></div> 
</div> 

所以这里的问题是,房号取决于房型。每种房型都有不同的房间号码。任何人都可以建议我如何在选择房间类型后重新加载房间号的值?

我正在使用引导程序。

+1

ajax将是一个很好的解决方案。例如,如果你是谷歌的负载,例如:https://www.google.co.uk/search?q=PHP+ajax+dependent+selects&oq=PHP+ajax+dependent+selects&aqs=chrome..69i57j0j69i60l3j0.3000j0j7&sourceid=chrome&ie = UTF-8 – ADyson

回答

1

你需要使用JS来重新加载房间号码,我会做的方式(绝不是最好的方式)是有一个脚本(我的下面使用jQuery),这比从一个脚本获取值更快DB但安全性较低:

$('#room_type').on('change', function(e){ // when the room_type changes 
    $('#room').remove('option'); // remove all previous options 

    let maxRooms = e.val() == "Shit Muncher Suite" ? 3 : 0; // set max rooms depending on room_type, e.val() is the room_type 

    for(var i = 0; i < maxRooms; i++) { 
    $('#room').add("option").text(i); // add a new option for each room (3) 
    } 

}); 
+0

你好,房间号是从数据库中提取的..这是可能的这个脚本? – Sohail

+0

不,你需要使用ajax调用: –

1

如果您希望数据库中的潜在数据在不刷新页面的情况下加载,则必须使用AJAX。如果不刷新整个页面,PHP无法加载新数据。希望我帮助:)

相关问题