Блог

У меня есть панель аккордеона, краткое описание которой представляет собой поле поиска:

Когда содержимое поля поиска изменится, панель откроется и отобразит результат поиска.

Случается, что события в поле поиска всплывают на вкладке, которая, следовательно, открывается и закрывается при нажатии клавиши пробел или ввод. Я попытался завернуть резюме в специальный раздел, который предотвращает всплывающее окно:

 class MyDiv extends Div {
    public MyDiv(Component... components) {
      super(components);
      getElement().executeJs("addEventListener('keydown', (e) => {console.log('pop up prevented'); e.stopPropagation();});");
    }
  }

...

    accordion.add(searchAccordionPanel = new AccordionPanel(new MyDiv(searchField),
        searchItemsPage = new MenuItemsPage(this)));


 

И на самом деле я вижу, что события перехвачены («всплывающее окно предотвращено» на консоли), но по какой-то причине аккордеон все еще реагирует на нажатие клавиши. Я также пробовал события ввода и нажатия клавиш, тот же результат.

Может быть, Ваадин передаст другое событие? Кто-нибудь может предложить решение?

По умолчанию TextField находится в режиме быстрого изменения значения, т. е. выдает изменение значения после каждого нажатия клавиши. Это не подходит для вашего варианта использования. Вы можете использовать textField.setValueChangeMode(ValueChangeMode.LAZY) , например. Затем TextField будет выдано изменение значения после того, как пользователь приостановил ввод. Есть также несколько других режимов, выберите тот, который лучше всего подходит для конкретного случая использования. Иногда это требует проб и ошибок.