Find the selected option Id from input Datalist in HTML


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id='browserinput' list="browsers">

<datalist id="browsers">
  <option id="1" value="Internet Explorer" />
  <option id="2" value="Firefox" />
  <option id="3" value="Chrome" />
  <option id="4" value="Opera" />
  <option id="5" value="Safari" />
</datalist>
$(function() {
  $('#browserinput').on('input',function() {
    var opt = $('option[value="'+$(this).val()+'"]');
    alert(opt.length ? opt.attr('id') : 'NO OPTION');
  });
});

Leave a comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.