Populate 2nd drop-down list based on 1st drop-down using API JSON

Question

I want to display data at 2nd drop-down list base on data chosen from 1st drop-down list. I used AJAX to get display data at 2nd drop downlist.

Below is the JSON result if facID = F09

Below is the AJAX code at where the drop-down list is located

<script>
    function getroom(val) {
      $.ajax({
        type: "POST",
        url: "../room_scheduler/room_scheduler.php",
        data:'factory_id='+val,
        success: function(data){
          $("#room-list").html(data);
        }
      });
    }
</script>   

and below is the room_scheduler.php

    <?php

    require_once "../../../config/configPDO.php";
    require_once "../../../config/check.php";

    //retrieve json
    $url = "http://172.20.0.45/TGWebService/TGWebService.asmx/roomList?facID='" . $_POST['factory_id'] . "'";
    $data = file_get_contents($url);
    $characters = json_decode($data);

        if(!empty($_POST["factory_id"])) {

            echo '<option value="">Select</option>';
            foreach ($characters->roomList as $character) {
            echo "<option value='$character->roomId'>$character->Room_Desc</option>";
            }

        }

    ?>

The result if, if in the 1st drop-down list I choose F09, there's no data display at the 2nd drop-down list. Can I know what is the problem?

Answer 1

Sorry guys, this question already solved by myself

    <?php

    require_once "../../../config/configPDO.php";
    require_once "../../../config/check.php";

    $factory_id = $_POST["factory_id"];

    //retrieve json
    $url = "http://172.20.0.45/TGWebService/TGWebService.asmx/roomList?facID=$factory_id";
    $data = file_get_contents($url);
    $characters = json_decode($data);

        if(!empty($factory_id)) {

            echo '<option value="">Select</option>';
            foreach ($characters->roomList as $character) {
            echo "<option value='$character->roomId'>$character->roomDesc</option>";
            }

        }


    ?>