title: Force user to select an option from data list
body: <p>I have a datalist input, with several options, and I want to force user to select an option <strong>from list.</strong>
  How can I do that? Here there is an example, but in this way I can write anything in input.</p>
  <p><strong>HTML</strong></p>
  <pre><code>&lt;label&gt;Choose a browser from this list:
  &lt;input list=&quot;browsers&quot; name=&quot;myBrowser&quot; id=&quot;myBrowser&quot; /&gt;&lt;/label&gt;
  &lt;datalist id=&quot;browsers&quot;&gt;
    &lt;option value=&quot;Chrome&quot;&gt;
    &lt;option value=&quot;Firefox&quot;&gt;
    &lt;option value=&quot;Internet Explorer&quot;&gt;
    &lt;option value=&quot;Opera&quot;&gt;
    &lt;option value=&quot;Safari&quot;&gt;
    &lt;option value=&quot;Microsoft Edge&quot;&gt;
  &lt;/datalist&gt;
  
  &lt;button&gt;get value&lt;/button&gt;
  </code></pre>
  <p><strong>JavaScript and jQuery</strong></p>
  <pre><code>$('button').on('click', function() {
      console.log($('#myBrowser').val());
  });
  </code></pre>
  <p>Sorry for my bad english.</p>
  <p><a href="https://jsfiddle.net/pewfp0wf/" rel="nofollow noreferrer">https://jsfiddle.net/pewfp0wf/</a></p>