how to onchange input value after selected dropdown - html

Question

I want to change the input value when the user select data on the input dropdown. The first thing to do after looping and setting data value in the html dropdown is to check whether the option is selected or not, but I am confused about how to check it, so I just checked by dropdown id but it didn't work, so how to check data input if selected?
this is my ajax code to return data dropdown for the first time:
$.ajax({
url : "{{ url('web/city/getdatacity') }}",
type : "POST",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')
},
data : {
province_id:id
},
success : function(data){
var html = '';
var postcode = '';
var i;
if(data.length == 0) {
html += '<option value = ""> City not found!</option>';
} else {
for(i=0; i<data.length; i++) {
html += '<option value = "'+ data[i].city_id +'">' + data[i].city_name +'</option>';
if($('#city_id').is(':selected')) { //here the problem when check if option above selected or not
postcode = data[i].postal_code; //input postal code in var postcode if true
}
}
}
$('.city').html(html);
$('#postalcode').val(postcode); //auto fill postal code value from postcode
})
});

Answer 1

Instead of using selected or onchange try something like this with your options attribute.
Look at the oninput
<label for="cars">Choose a car:</label>
<select id="cars" name="cars" oninput="console.log(this.value)">
<option value="volvo">Volvo XC90</option>
<option value="saab">Saab 95</option>
<option value="mercedes">Mercedes SLK</option>
<option value="audi">Audi TT</option>
</select>