Question

我有一个选择选项，我可以从php脚本中选择一个酒店名称。

然后我有另一个选择选项，根据从第一选择选项中选择的酒店显示房间类型。

当我在ajax的帮助下选择酒店时，我在第二个选择选项中只获得一种房型，而在我的桌子中，我有一个房间类型用于单个酒店。

我的php代码用于获取房间类型。

<?php 
      include('mysql.php'); 
      $h_id = $_POST['hotel_id'];
      $result = mysql_query("SELECT * FROM room_type WHERE hotel_id = '$h_id'"); 
      while($row = mysql_fetch_array($result, MYSQL_ASSOC)){
            $type_name = $row['type_name'];
            $type_id = $row['roomtype_id'];
            echo $type_name.",".$type_id;
      }


      exit();   
?>

的javascript：

＆＃13;

jQuery(document).ready(function($){
  $('#hotel_list').change(function(){
    $.ajax({
        type:'post',
        url:'roomtype_fetch.php',
        data: 'hotel_id='+ $(this).val(),                 
        success: function(value){
             var data = value.split(",");
            var type_name =data[0];
            var type_id =data[1];
            $("#roomtype_list").html("<option value="+type_id+">"+type_name+"</option>");
        }
    }); 
  });
});

＆＃13;

用于第一选择选项的html，其php用于获取酒店名称。

<select class="form-control" name="hotel_list" id="hotel_list" onchange="cal()">
    <option>--Select--</option>
    <?php
         $query2 = mysql_query("SELECT * FROM hotel") or die("the query cannot be completed at this moment");
         if(mysql_num_rows($query2) <1) {
    ?>
    <option>No Hotel Found!</option>
    <?php
         }
         while($row = mysql_fetch_array($query2, MYSQL_ASSOC)){
              $hotel_name = $row['hotel_name'];
              $hotel_id_1 = $row['hotel_id'];
    ?>
    <option value="<?php echo $hotel_id_1; ?>"><?php echo $hotel_name; ?></option>
    <?php
        }
    ?>
</select>

第二个选择HTML代码：

<select class="form-control" name="roomtype_list" id="roomtype_list">
    <option>--Select--</option>                     
</select>

任何类型的帮助都将受到赞赏。

Answer 1

你不能直接做value.split（＆＃34;，＆＃34;），因为你的php输出如下：

name1,id1name2,id2name3,id3

如果将行更改为：

，则

echo不会在末尾添加新行

echo $type_name.",".$type_id,"\n";

这会给你一个输出：

name1,id1
name2,id2
name3,id3

然后你可以用＆＃34; \ n＆＃34;然后通过＆＃34;，＆＃34;获得一系列线条。分隔名称和ID：

var data = value.split(",");
data.forEach(function(line){
    var type_values = line.split(",");
    var type_name = type_values[0];
    var type_id = type_values[1];
    $("#roomtype_list").html("<option value="+type_id+">"+type_name+"</option>");
}

但无论如何，我认为你最好的选择是改变你的php以返回JSON：

$result = array();
while($row = mysql_fetch_array($result, MYSQL_ASSOC)){
    $result[] = $row;
}
echo json_encode($result);

然后做一些像：

var data = JSON.parse(value);
$("#roomtype_list").empty();
data.forEach(function(type){
    $("#roomtype_list").append("<option value="+type.roomtype_id+">"+type.type_name+"</option>");
});

Answer 2

首先，你生成类型的php循环输出错误：

  while($row = mysql_fetch_array($result, MYSQL_ASSOC)){
        $type_name = $row['type_name'];
        $type_id = $row['roomtype_id'];
        echo $type_name.",".$type_id;
  }

这给你这样的东西：

name1,type1name2,type2name3,type3...

您应该在其间添加;或其他分隔符，因此请将回显线更改为：

echo $type_name.",".$type_id.",";

那会给你一个这样的输出：

name1,type1;name2,type2;name3,type3...

第二件事是，你必须通过你收到的类型循环使用jquery。您将收到的字符串拆分为数组：

var data = value.split(",");

..所以你应该在你的javascript成功函数中执行以下操作：

...
success: function(value){
        var data = value.split(";");
        //split all types first with ";"
        $.each(data, function() {
            var type = $(this).split(",");
            //then split the type in name and id
            var type_name = type[0];
            var type_id = type[1];
            //add every type to roomtype_list
            $("#roomtype_list").html("<option value="+type_id+">"+type_name+"</option>");
        });
}
...

说明：首先使用分隔符";"拆分所有类型，然后使用","拆分名称和ID中的类型。我希望这会有所帮助。

如何从php获取多个数据并使用ajax将其存储在选择选项中

2 个答案: