How to dynamicaly change data in dropdown on chnage of text box Jquery

How to dynamicaly change data in dropdown on chnage of text box Jquery

I have a text box and dropdown. Text box contains the province name and
the dropdown contains the the cities. I want to chnage the province of the
text box and dynamically change the dropdown related to the text in the
textbox. I am using codeigniter framework. My view is as follows and I get
the data from the database. I think there is a problem with the onchange
or that kind of event of the text box (this code worked for change event
for another dropdown. But it is not working for the taxt box- so the other
logic is ok but I cant figure out the event of the textbox. What is the
right event for the text box ? My code
<script> .........................<script>
$(document).ready(function(){
$('#provincial').on('input',function()
{
var id_provincia = $('#provincial').val();
$.ajax(
{
type: "POST",
dataType: "json", // I ADDED THIS LINE
url:"tenda/get_comuni/"+id_provincia,
success: function(comuni)
{
$('#comuni').empty();
$.each(comuni,function(id_comune, nome_comune)
{
var opt = $('<option />');
opt.val(id_comune);
opt.text(nome_comune);
$('#comuni').append(opt);
});
}
});
});
});
</script>
</head>
provincia: comune: