php change textbox value base on drop down list

Question

I have a table name tbl_material:

material | description

1000 | Samsung

2000 | Iphone

i write the code below to get material field into drop down list of HTML

require ("con_config.php");
$select_material_code = "SELECT material, description FROM tbl_material";
$get_material_code = mysqli_query ($con, $select_material_code);
$options_material_Code = "--Select Product--";
$option_material_description = "";
while ($result_material_code = mysqli_fetch_array($get_material_code))
{
    $options_material_Code = $options_material_Code."<option>$result_material_code[1]</option>";
}

Here is HTML

<select name="materialcode_1" id="materialcode_1">
<option value = "<?php echo $options_material_Code;?>"><?php echo $options_material_Code;?></option>
</select>

I have a textbox:

<input type="text" name="description_1" placeholder="Description" maxlength="40" size="40" value="" id="description_1">

I want to get description field from tbl_material if i change drop down list value. how to do it? please help....

Answer 1

$("#materialcode_1").change(function(e) {
    $("#description_1").val($("#materialcode_1").val())

});

Answer 2

This answer assumes the description may contain arbitrary text, possibly text longer than you'd want to put in the value of the dropdown, that's why I used a JSON object.

First, let's just get all the results at once so we can JSON encode them, and then do our looping.

$result_material_code = mysqli_fetch_all($get_material_code, MYSQLI_ASSOC);
echo '<select name="materialcode_1" id="materialcode_1">';
foreach($result_material_code as $index=>$row){
    echo "<option value='$index'>{$row['material']}</option>";
}
echo "</select>";

Then we drop the JSON into a Javascript and use jQuery to listen for changes to the drop-down. When the user changes the drop down, show an alert with the description.

$(function(){
    // Give the DB results to JavaScript
    var materialcode_1_data = <?php echo json_encode($result_material_code); ?>;

    // Listen for Dropdown changes
    $("#materialcode_1").change(function(){
        // Alert the description
        alert(materialcode_1_data[$(this).val()].description);
    });
});

See:

mysqli_fetch_all()

change()

Answer 3

$('#materialcode_1').on('change', function() {
  $('#description_1').val($(this).val());
});