How to display data in textbox from database MySQL based on selected option?

Question

I have a table "tb_seri" in MySQL, with columns "id_seri", "nm_seri" and "value_seri"

So, I want to select "nm_seri" in the select option, and then "value_seri" will appear in the textbox afterwards based on "nm_seri" selected

Here is the code to select "nm_seri" from the database

<select name="nm_seri" id="nm_seri" onchange="myfunction()" required>
    <option disabled selected>-Pilih Seri-</option>
        <?php
             $qu="Select DISTINCT nm_seri from tb_seri";
             $res=$koneksi->query($qu);

             while($r=mysqli_fetch_row($res))
             { 
                 echo "<option data-value='$r[1]' value='$r[0]'> $r[0] </option>";
             }
        ?> 
</select>

And I've tried various codes from here, but I'm still confused.

And this textbox code to display "value_seri"

<input type="text" name="value_seri" id="value_seri" value="" disabled><br></td>
<script>
    function myFunction()
    {
        var value_seri = $('#value').find(':selected').data('nm_seri');
                            $('#value').val(value_seri);
    }
</script>

I have tried this method, (stackoverflow.com/a/48514474/14926713) but still can't — brotherdrew20
– brotherdrew20, Commented Jan 2, 2021 at 12:49
I see so can you edit your current code with changes you have made using that answer and error you are getting as well ? — Swati
– Swati, Commented Jan 2, 2021 at 12:53
Warning: mysql_* extension is deprecated as of PHP 5.5.0, and has been removed as of PHP 7.0.0. Instead, either the mysqli or PDO_MySQL extension should be used. See also the MySQL API Overview for further help while choosing a MySQL API. — Dharman
– Dharman ♦, Commented Jan 2, 2021 at 13:38

Swati · Accepted Answer · 2021-01-02 14:38:37Z

In your current js code there is no value it should be nm_seri .Then , you are getting data attribute using data('nm_seri') it should be data('value') and show this value inside input box using $('#value_seri').val(value_seri); .Also ,your function name should match with onchange="myfunction()" so change that as well.

Demo Code :

function myfunction() {
  var value_seri = $('#nm_seri').find(':selected').data('value');
  $('#value_seri').val(value_seri);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="nm_seri" id="nm_seri" onchange="myfunction()" required>
  <option disabled selected>-Pilih Seri-</option>
  <option data-value='1' value='soemthing'> soemthing</option>
  <option data-value='2' value='soemthing2'> soemthing2</option>
  <option data-value='3' value='soemthin3g'> soemthing3</option>
</select>

<input type="text" name="value_seri" id="value_seri" value="" disabled><br>

Collectives™ on Stack Overflow

How to display data in textbox from database MySQL based on selected option?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related