如何从php下拉菜单中添加选择和更新图像

I have a php dropdown menu that currently does not update and set the selected choice when one is made

it is populated from a database, I would like to be able to get the value of the selected choice so i can update the picture of the persons face (face to go with name) also need to know how to set selected option to just the selected option instead of to every one in the list here is what i have

$SQL = "SELECT id, name, facePic FROM people";
echo "<option>Select one</option>";
$res = $db->query($SQL);
while($row = mysqli_fetch_array($res)){
    $name = $row['name'];
    $id = $row['id'];
    $img = $row['facePic'];
    echo "<option value=".$id.">".$name."</option>";
}
echo "</select>";

any help is greatly appreciated

ps. i dont mind if i have to do it with something other than php as long as my dropdown is still populated from db

also i am planning to have the img show in a separate div but still in the same form

Not sure what you plan to do with 'facePic' as I don't see it in your output. For your PHP:

echo "<option>Select one</option>";
$res = $db->query($SQL);
while($row = $res->fetch_assoc()){
    echo "<option value='{$row['id']}' pic='{$row['facePic']}'>{$row['name']}</option>
";
}

Then in your JQuery:

$(function(){
  $("select").on("change", function(){
    $("#targetImage").attr("src", $(this).find("option:selected").attr("pic"));
  });

});

If I understood your question correctly, you want to update a picture based on the value of a dropdown?

If so then what you could do is use jQuery like so: (Let's say that the image tag has an id #image and that the image names are in this form id.jpg")

var image_src = $("select").val();
$("#image").attr("src", image_src);

Of course if you want to use the actual values that are displayed to the user ($name in your case) then instead of using

$("select").val();

you would need to use

$("select option:selected").text();