ポップアップ

Wijmoのwijmo.inputモジュールには、Popupコントロールが含まれています。このコントロール以外に、Wijmoコアには、任意のコンテンツをポップアップで表示／非表示にすることができるメソッドが2つ用意されています。これらのメソッドはPopupコントロールに関連付けられていません。任意のHTML要素と組み合わせて使用できます。

これらのメソッドは単純です。

• showPopup()

• hidePopup()

表示

ポップアップを表示するには、HTML要素を引数として渡す必要があります。このHTMLがポップアップとして表示されます。

たとえば、ListBoxなどのコントロールをポップアップとして表示するには、コントロールテンプレートを作成して、コントロールをインスタンス化する必要があります。次に、そのコントロールを引数として渡して、showPopupメソッドを呼び出します。

例

import * as wijmo from '@mescius/wijmo';
import * as wjInput from '@mescius/wijmo.input';

let listbox = new wjInput.ListBox('#myListbox', {
    itemsSource: data,
    checkedMemberPath: 'visible',
    displayMemberPath: 'country'
});

...
// ポップアップを表示にします
wijmo.showPopup(listbox.hostElement);

非表示

ポップアップを非表示にするには、HTML要素を引数として渡して、hidePopupメソッドを呼び出します。

// ポップアップを非表示にします
wijmo.hidePopup(listbox.hostElement);