Focus select without opening the dropdown

[erlingur]

Hi there!

Does anyone have an easy way to actually focus a TomSelect without opening the dropdown? If I set openOnFocus: false it will disable the dropdown when clicking on the field.

I would like to be able to programmatically focus a select without the dropdown opening but when a user clicks on it, it should open the dropdown.

Thanks!

[thelfensdrfer]

This would be great. At the moment we had to disable openOnFocus in Edge, because the autofill function will jump between the select fields.

[tobidemski]

Hey I also noticed this limitation. I built a workaround so I can open / close it only on click or spacebar when using the keyboard.

const tomSelect = new TomSelect(selectBox, {
  create: false,
  maxItems: 1,
  hideSelected: hideCurrent,
  controlInput: null, // Disable search
  openOnFocus: false, // Disable open when focus
});

tomSelect.on('focus', function () {
  if (tomSelect.control._isclick != true) {
    return;
  }
  tomSelect.control._isclick = false;

  if (tomSelect.isOpen) {
    tomSelect.close();
    return;
  }

  tomSelect.open();
});

tomSelect.control.addEventListener('click', function (e) {
  e.preventDefault();

  if (!tomSelect.wrapper.classList.contains('focus')) {
    tomSelect.control._isclick = true;
    return;
  }

  tomSelect.open();
});

tomSelect.control.addEventListener('keydown', function (e) {
  if (e.key == ' ') {
    e.preventDefault();
  }
});

tomSelect.control.addEventListener('keyup', function (e) {
  if (e.key != ' ') {
    return;
  }

  if (tomSelect.isOpen) {
    return;
  }

  tomSelect.open();
});