take a value from a select option and use it on php

Question

I have this select , i wanna save each value after change , save it and use in other select

This is my code :

<?
$sql = "SELECT * FROM championnat ";
$result = $conn->query(sprintf($sql));
if($result){
    if ($result->num_rows != 0)
    {  
        $rows=array(); 
?>
<select name="nom_championnat" id="nom_championnat" >
    <option value=""></option>
    <?php
        while($r=mysqli_fetch_assoc($result))
        { 
    ?>
    <option   value=" <?php echo $r['idChampionnat']?>" name="nom_championnat" selected >
    <?php  echo $r['nomChampionnat']  ?></option>
    <?php
        }
    }
}
?>
</select>
</div>

I need the variable $r['idChampionnat'] to save it in each select and use it in this requete , how can it asve and put it in that requete sql ????

<?php
$sql = "SELECT * FROM equipe  where idChampionnat=???? ";
$result = $conn->query(sprintf($sql));
if($result){
    if ($result->num_rows != 0)
        {
        $rows=array(); 
?>
<select name="equipe1" >
    <option value=""></option>
    <?php
        while($r=mysqli_fetch_assoc($result))
        { 
    ?>
    <option  required value=" <?php echo $r['nomEquipe']?>" name="equipe1" selected ><?php  echo $r['nomEquipe']  ?>
    </option>
    <?php
        }
    }
}
?>
</select>

just to clear it ,

Answer 1

You need to use jQuery to fire an AJAX call when the first box is selected.

Its been a while since I've done this but this should give you some idea. I took some code from here and here as example

Say your html looks like this

<select id="nom_championnat">
    <option value="value1">value1</option>
    <option value="value2">value2</option>
</select>
<select id="equipe1"></select>

then you need to tell jquery what to do when nom_championnat changes selection

$('#nom_championnat').change(function() {
    var data = "";
    $.ajax({
        type:"POST",
        url : "queryfile.php",
        data : "value="+$(this).val(),
        async: false,
        success : function(response) {
            data = response;
            return response;
        },
        error: function() {
            alert('Error occured');
        }
    });
    var string = data.message.split(",");
    var array = string.filter(function(e){return e;});
    var select = $('equipe1');
    select.empty();
    $.each(array, function(index, value) {          
        select.append(
                $('<option></option>').val(value).html(value)
            );
    });
});

and then you need a queryfile.php to handle the ajax requests, something like

<?php 
   print_r($_POST);
   $value = $_POST["value"];
   $sql = "select where {$value} ..."
   $result = execute($sql);
   echo $result;
?>