Поле поиска не ясно для другого всплывающего списка - PullRequest
0 голосов
/ 08 апреля 2019

Я использую модуль Devextreme для всплывающего окна dxlist.Я могу открыть всплывающее окно и показать список элементов с полем ввода поиска, но у меня есть еще одно всплывающее окно списка.Когда я ищу в первом всплывающем окне и закрываю его, открываю второе всплывающее окно, текст поля поиска не очищается.

    <dx-popup class="popup popupMore" [width]="500" [height]="500" [showTitle]="true" title="{{popupdata.name}}" [dragEnabled]="false"
  [closeOnOutsideClick]="true" [(visible)]="isVisible">

  <div class="list-container">
    <dx-list #list [dataSource]="popupdata.data" [height]="400" [searchEnabled]="true" 
      searchMode="contains"  >
      <div *dxTemplate="let data of 'item'">
        <div>{{data}}</div>
      </div>
    </dx-list>
  </div>
</dx-popup>

Приведенный выше код используется в html.Это же всплывающее окно откроется для еще двух событий.

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

Может ли кто-нибудь помочь мне, как очистить поле поиска для следующего всплывающего списка?

Заранее спасибо.

1 Ответ

0 голосов
/ 10 апреля 2019

Как упомянуто в комментарии выше, самый умный подход, который я мог придумать, - это регистрация события dxPopup s onShown, и при срабатывании вы можете:

  • Сбросить list.instance опция searchValue (с использованием this.list.instance.option('searchValue','');).
  • Назначить компоненту dx-list двустороннее связанное значение и сбросить это значение.В этом случае, в частности, добавьте [(searchValue)]="_searchValue" в тег html dx-list и добавьте this._searchValue = '' в onShown callback dxPopup.
...