Search code examples
javascripthtmlautocomplete

Turn ON and OFF checkbox for an autocomplete function

I have a wep app that has an autocomplete feature that being triggered when the user insert's a few specifhic words.

I would like to know how can I create a checkbox using HTML that will enable and disable the autocomplete.

Thanks, Shoam

I was trying to find a way to do that but did not found a way, even tho I knlw it should not be too complex.

Solution

  • Set the autocomplete attribute on the input on the change event for the checkbox using event.target.checked:

    document.querySelector('#autocomplete').addEventListener('change', event => 
    document.querySelector('#username').setAttribute('autocomplete', event.target.checked ? 'on' : 'off')
    + console.log(document.querySelector('#username'))
);
    <input id="username" autocomplete="off" />
<label><input type="checkbox" id="autocomplete" /> autocomplete</label>