Visualizzare anteprima foto in dropdown

[Alex_70]

Buongiorno a tutti,

mi servirebbe un aiuto, vorrei visualizzare un'anteprima della foto a lato quando seleziono i dropdown

ho provato con javascript ma non funziona,

inoltre vorrei avere la possibilita' di fare una ricerca in dropdown senza scorrere tutta la lista

mi potete aiutare?

<?php
        
        
        require_once("connetti.php");

        //select all movie ids, titles, and years and place as options into dropdown
        $movieRS=mysql_query("SELECT film_id, movie_title, year FROM film ORDER BY movie_title ASC", $db_connection) or die(mysql_error());
        $movieOptions="";
        while ($row=mysql_fetch_array($movieRS))
        {
            $id=$row["film_id"];
            $title=$row["movie_title"];
            $year=$row["year"];
            $movieOptions.="<option value=\"$id\"> [".$id."] ".$title." [".$year."]</option>";
        }
        
        //select all movie ids, titles, and years and place as options into dropdown
        $actorRS=mysql_query("SELECT actor_id, nome, foto, birthday FROM actor ORDER BY nome ASC", $db_connection) or die(mysql_error());
        $actorOptions="";
        while ($row=mysql_fetch_array($actorRS))
        {
            $id=$row["actor_id"];
            $nome=$row["nome"];
            $foto=$row["foto"];
            $birthday=$row["birthday"];
            $actorOptions.="<option value=\"$id\"> [".$id."] ".$nome."  [".$birthday."] ".$foto."</option>";
            $actorOptions2.="<option value=\"$id\"> ".$nome."</option>";
        }
        
        //free up query results
        mysql_free_result($actorRS);
        
?>       
            Movie:    <select name="film_id">
                        <?=$movieOptions?>
                    </select><br/><br/>
            Actor:    <select name="actor_id">
                        <?=$actorOptions?>
                    </select><br/><br/>
                    
                    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<select name="dropdown" id="dropdown">
    <option value="<?=$actorOptions2?>">1</option>
    
</select>
<img id="image" src="image_upload/actor/uploads/<?=$nome?> (<?=$id?>)/<?php echo $row['foto']; ?>" width="110px" height="130px" style="border:1px solid #333333;" />
<script type="text/javascript">
$(function(){
    $( '#dropdown' ).change(function(){
        $( '#image' ).attr( 'src', $( this ).val() + ".jpg" );
    })
});
</script>
                    
                    
                    
            
            Credited:    <input type="text" name="credited" value="<?php echo htmlspecialchars($_GET['credited']);?>" maxlength="100"><br/>
            <br/>
            <input type="submit" value="Link Actor to Movie"/>
        </form>
        <hr/>

 

[macus_adi]

Prova così e vedi in console cosa ti da----

fireAction(el){
console.log(el);
debbuger
}

val element=$('#dropdown').on('change',function(){
       fireAction(this);
});

 

[Alex_70]

Prova così e vedi in console cosa ti da----

fireAction(el){
console.log(el);
debbuger
}

val element=$('#dropdown').on('change',function(){
       fireAction(this);
});

dove mettere il codice?