CODEWITHSUNDEEP
jquery
phphopzter
phphopzter

Reputation: 121

Copy input values in option dropdown jquery

How to duplicate input value into dropdown option automatically?

I have text field where user will going to input some values (Let say an amount), Now, I want this values to be copied or duplicate in my dropdown option field automatically, particularly on my first "option", How do I do that?

<input id='appraisal_value' type='number'>

<select id='srp'>
    <option value='//This is where the users values from input `appraisal_value` goes '>Appraisal Value</option>
    <option value'<?php echo $BookValue; ?>'>Book Value</option>
</select>

Upvotes: 0

Views: 126

Answers (2)

J.C. Fong
J.C. Fong

Reputation: 546

$("#appraisal_value").on("keyup", function(){
  $("#srp").children("option:first").val($(this).val());
});

This example shows when user keyup in the text field, value of first option in the select will replace with text field value.

Upvotes: 0

guradio
guradio

Reputation: 15555

$('#appraisal_value').change(function() {

  var value = $(this).val();
  $('#srp').prepend('<option>'+value +'</option>')
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id='appraisal_value' type='number'>

<select id='srp'>
  <option value='//This is where the users values from input `appraisal_value` goes '>Appraisal Value</option>

</select>

Use .prepend()

Description: Insert content, specified by the parameter, to the beginning of each element in the set of matched elements.

Upvotes: 2

Related Questions