HTML <datalist> feature not triggered in Microsoft Edge

Issue

I'm testing the HTML's datalist tag on Microsoft Edge.

It works fine but the problem with Edge is that there is an option to close the autofill dialog by clicking the "Don't show saved information".

If a user were to accidentally close it, the autocomplete feature is not triggered anymore even after refreshing the page.

The only way to re-activate the feature is by editing the browser's settings manually.

In contrast, Chrome and Firefox do show the autocomplete in modal that do not have a close option.

Solution

You probably need to set your input to autocompleteOff, so Microsoft Edge lost his control trying to show it's popup feature.

<form action="#" method="get">
  <label for="autocompleteOff">Use Microsoft Edge as your browser and select on the list:</label>
  <input type="text" autocomplete="off" list="autocompleteOff"
id="myId" name="myName" placeholder="Placeholder here" />
  <datalist id="autocompleteOff">
    <option value="Selection 1">
    <option value="Selection 2">
    <option value="Selection 3">
    <option value="Selection 4">
    <option value="Selection 5">
  </datalist>
  <input type="submit">
</form>

Use Microsoft Edge when trying this, so you can check if it's working!

Answered By - Keyboard Corporation