JQuery select value output value

Question

I wish to output the value in option in the input value field. So if i select red i wish to output red in the input value

$(document).ready(function(){
    $("select").click(function(){
        $("input:text").val($this);
    });
});

<select>
  <option value="red">red</option>
  <option value="black">black</option>
  <option value="blue">blue</option>
</select>
<input type="text" id="input" value="">
<div id="output"></div>

`$("input:text").val($(this).val());` - there is no `$this` in the change event handler, you can get the select input's value using `$(this).val()` — Arun P Johny, Apr 14 '16 at 13:55

score 0 · Accepted Answer · answered Apr 14 '16 at 13:57

you should use .change() not click()

$(document).ready(function(){
    $("select").change(function(){
        $("input[type=text]").val($(this).val());
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option value="red">red</option>
  <option value="black">black</option>
  <option value="blue">blue</option>
</select>
<input type="text" id="input" value="">
<div id="output"></div>

JQuery select value output value

1 Answers1