-1

I have 2 dropdown options but I want them to be retrieved once the first dropdown value is selected or like the second dropdown options depend on the first dropdown option

    <select name="campusselect">
            <?php 
                $result= $conn->query("select campus_name from campus");
                while( $row = $result->fetch_assoc()) {
                    $campus_name=$row['campus_name'];
                    echo "<option value='$campus_name'>$campus_name</option>"; 
                }                  
            ?>
        </select>

    <!--room drop down-->
        <select name="roomsselect">
            <?php 
                $result= $conn->query("SELECT room_name FROM rooms WHERE room_campus=".$campus_name);
                while( $row = $result->fetch_assoc()) {
                    $room_name=$row['room_name'];
                    echo "<option value='$room_name'>$room_name</option>"; 

                }
            ?>
        </select>
Deamon
  • 3
  • 3
  • is there any associated javascript to this? The first dropdown should trigger an `onchange` event which you listen for and respond to create content of the second dropdown ~ usually Ajax. Alternatively you can use the first to issue a GET request and use the querystring / GET variable in the 2nd. As your code stand it will, by the looks of things, select items for the last record in the first dropdown only – Professor Abronsius May 07 '20 at 06:10
  • @RamRaider i havent included any javascript as of now, i wanted to have it in plain PHP, if javascript is better can i get a sample of how it should be – Deamon May 07 '20 at 06:15
  • well somehow there needs to be an exchange of information from the 1st that helps select records in the 2nd. Ajax or regular form submission / GET request... which is it to be? – Professor Abronsius May 07 '20 at 06:16
  • https://stackoverflow.com/questions/27981674/set-the-option-available-for-select-based-on-another-select-php may be worth a read. – Nigel Ren May 07 '20 at 06:17
  • @RamRaider all of the these inputs are in a form, that will give separate result based on dropdown values selected – Deamon May 07 '20 at 06:20

1 Answers1

1

Focussing on these two SELECT menus only and using just a small piece of Javascript you could try something like the following. The javascript event listener issues a GET request when there is a change event on the first dropdown. The querystring parameter campus is then used in the sql satement for the 2nd dropdown.

<select name="campusselect">
<?php 
    $result= $conn->query("select `campus_name` from `campus`");
    while( $row = $result->fetch_assoc() ) {
        printf( '<option>%s', $row['campus_name'] );
    }                  
?>
</select>

<script>
    document.querySelector('select[name="campusselect"]').addEventListener('change', function(e){
        location.search='campus='+this.value;
    });
</script>


<!--room drop down-->
<select name="roomsselect">
<?php
    if( isset( $_GET['campus'] ) ){
        $sql='select `room_name` from `rooms` where `room_campus`=?';
        $stmt=$conn->prepare($sql);
        $stmt->bind_param('s',$_GET['campus']);
        $res=$stmt->execute();
        $stmt->bind_result($room);

        while( $stmt->fetch() )printf('<option>%s',$room);
    }
?>
</select>
Professor Abronsius
  • 33,063
  • 5
  • 32
  • 46
  • i tried but this dont work, once i change the values in first dropdown it reloads the page – Deamon May 07 '20 at 06:37
  • As I mentioned - there needs to be some means of communicating the cahnge from the client ( browser ) to PHP (server)... usually this is done via AJAX but could be done as here - with a page reload / GET request. I think you are looking for an AJAX solution!! – Professor Abronsius May 07 '20 at 08:06