how to get dropdown value from left join table - php

Question

I have problem when I get value from left join table, database from product table (https://ibb.co/zbpJP0z )and database from farm table !(https://ibb.co/gMKySpP )
I've tried to get the value from dropdown list, but the value is always from joining table
this is my form code
<form class="mb-2" id="addproductform" method="post" enctype="multipart/form-data">
<div class="form-group">
<label for="serial-number">Serial Number:</label>
<select class="serial-number form-control" name="serial-number" class="custom-select mb-3" id="newval">
<option>Serial Number</option>
<?php $q=mysqli_query($link,"SELECT produk.nama FROM produk LEFT JOIN farm ON produk.SN=farm.SN WHERE username=\"$_SESSION[username]\"");
while($d=mysqli_fetch_row($q)) {
echo "<option value=$d[0]>$d[0]</option>";
} ?>
</select>
</div>
</form>
..........................
and this is a jquery code
$(document).ready(function(e){
$("#save_addPlant").click(function(e){
e.preventDefault();
console.log("submit productform");
$("select.serial-number").change(function(){
var tp = $(this).children("option:selected").val();
});
namafarm=$("option:selected").val();
console.log(namafarm);
});
});
How can I take a value from farm.SN, while I display produk.nama in the dropdown list?

Answer 1

There are 2 places that need change in your code.
Your are using 2 class attributes in your select tag. The second
class attribute wont work. So you have to combine the 2 class
attributes into 1.
You are only selecting produk.nama column in your select query. You
must also select produk.SN column.
Replace your select block with the code below & check whether it works.
<select class="custom-select mb-3 form-control serial-number" name="serial-number" class="" id="newval">
<option>Serial Number</option>
<?php
$q = mysqli_query( $link, "SELECT produk.SN,produk.nama FROM produk INNER JOIN farm ON produk.SN = farm.SN WHERE username = \"$_SESSION[username]\"" );
while($d=mysqli_fetch_row($q)) {
echo "<option value=$d[0]>$d[1]</option>";
}
?>