javascript - Onchage pass 2 values

Hello is there a way in a dropdown select element to pass in OnChange function 2 values, one of which should be the value selected and the other a PHP variable ?

something like this :

<div>
    <?php   
        $sql4 = "SELECT DISTINCT (color), id FROM mytable ORDER BY id ASC ";    
        $result4 = $conn->query($sql4);
    ?>
    <select onchange="function(this.value,$row4['name'])" class="form-control selectpicker" data-size="10" data-live-search="true" data-style="btn-white" name="my_name" required  >
        <?php 
            if ($result4->num_rows > 0) 
            {
                while($row4 = $result4->fetch_assoc()) 
                {
                if($row4['id']>0)
                {
        ?>
        <option value="<?=$row4['id'];?>"><?=$row4['name'];?></option>
        <?php }}}?>
    </select>
</div>

Answer

Solution:

If your desired function is

myFunction(value, name){}

Use tag inside the string

<div>
    <?php   
        $sql4 = "SELECT DISTINCT (color), id FROM mytable ORDER BY id ASC ";    
        $result4 = $conn->query($sql4);
    ?>
    <select onchange="myFunction(this.value,'<?php echo $row4['name'] ?>')" class="form-control selectpicker" data-size="10" data-live-search="true" data-style="btn-white" name="my_name" required  >
        <?php 
            if ($result4->num_rows > 0) 
            {
                while($row4 = $result4->fetch_assoc()) 
                {
                if($row4['id']>0)
                {
        ?>
        <option value="<?=$row4['id'];?>"><?=$row4['name'];?></option>
        <?php }}}?>
    </select>
</div>

Answer

Solution:

  1. function is a protected keyword, you can't call a function "function"
  2. to access the selected option in a select dropdown we use selectedIndex or selectedOptions but not value.
<div>
    <?php   
        $sql4 = "SELECT DISTINCT (color), id FROM mytable ORDER BY id ASC ";    
        $result4 = $conn->query($sql4);
    ?>
    <select onchange="myFunction(event, <?php echo $row4['name'] ?>)" class="form-control selectpicker" data-size="10" data-live-search="true" data-style="btn-white" name="my_name" required  >
        <?php 
            if ($result4->num_rows > 0) 
            {
                while($row4 = $result4->fetch_assoc()) 
                {
                if($row4['id']>0)
                {
        ?>
        <option value="<?=$row4['id'];?>"><?=$row4['name'];?></option>
        <?php }}}?>
    </select>
</div>
function myFunction(event, rowName) {
    const select = event.target;
    const selectedOptions = select.selectedOptions;
    // ??�
}

Source