[]
【重要】2024年1月公開のアップデート「未適用」のお客様へ デモ ヘルプ APIリファレンス
トライアル版
(Showing Draft Content)

Wijmo.Control

Control クラス

すべてのWijmoコントロールの基本クラス。

Control クラスは、DOM要素と実際のコントロールとの関連を処理します。 コントロールをホストしているDOM要素を取得するにはhostElement プロパティを使用し、 特定のDOM要素でホストされているコントロールを取得するにはgetControl メソッドを使用します。 さらに、Control クラスは、コントロールの無効化と更新、 コントロールのサイズが変更されたときのコントロールレイアウトの更新、 およびコントロールの構造を定義するHTMLテンプレートの処理に関する 共通のパターンを提供します。

階層

コンストラクタ

プロパティ

メソッド

イベント

コンストラクタ

constructor

  • new Control(element: any, options?: any, invalidateOnResize?: boolean): Control

  • Control クラスの新しいインスタンスを初期化してDOM要素にアタッチします。

    引数

    • element: any

      コントロールをホストするDOM要素、またはホスト要素のCSS セレクター（例: '#theCtrl'）。

    • オプション options: any

      コントロールの初期化データを含むJavaScriptオブジェクト。

    • オプション invalidateOnResize: boolean

      コントロールのサイズが変更されたときにコントロールを無効にするかどうか。

    戻り値 Control

プロパティ

hostElement

hostElement: HTMLElement

コントロールをホストしているDOM要素を取得します。

isDisabled

isDisabled: boolean

コントロールが無効かどうかを判定する値を取得または設定します。

無効化されたコントロールは、マウスイベントやキーボードイベントを取得できません。

isTouching

isTouching: boolean

現在、コントロールがタッチイベントを処理しているかどうかを示す値を取得します。

isUpdating

isUpdating: boolean

コントロールが現在更新中かどうかを示す値を取得します。

rightToLeft

rightToLeft: boolean

要素内のコントロールを右から左のレイアウトでホストするかどうかを示す値を取得します。

tabOrder

tabOrder: number

コントロールに関連付けられたtabindex属性の値を取得または設定します。

tabindex属性値は、コントロールのホストHTML要素で指定することで、 Wijmoコントロールに対して静的に定義できます。 ただし、Wijmoコントロールは複雑な構造であり、コントロールが正しく機能できるように、属性値を内部要素に伝達する必要があるため、 この値をアプリケーションのライフサイクルの後半で変更することはできません。

そのため、コントロールのtabindexを動的に読み取ったり変更したりするには、このプロパティを使用して行う必要があります。

メソッド

addEventListener

  • addEventListener(target: EventTarget, type: string, fn: any, capture?: boolean, passive?: boolean): void

  • Adds an event listener to an element owned by this Control.

    The control keeps a list of attached listeners and their handlers, making it easier to remove them when the control is disposed (see the dispose and removeEventListener methods).

    Failing to remove event listeners may cause memory leaks.

    The passive parameter is set to false by default, which means the event handler may call event.preventDefault(). If you are adding passive handlers to touch or wheel events, setting this parameter to true will improve application performance.

    For details on passive event listeners, please see Improving scrolling performance with passive listeners.

    引数

    • target: EventTarget

      Target element for the event.

    • type: string

      String that specifies the event.

    • fn: any

      Function to execute when the event occurs.

    • オプション capture: boolean

      Whether the listener should be handled by the control before it is handled by the target element.

    • オプション passive: boolean

      Indicates that the handler will never call preventDefault().

    戻り値 void

applyTemplate

  • applyTemplate(classNames: string, template: string, parts: Object, namePart?: string): HTMLElement

  • コントロールの新しいインスタンスにテンプレートを適用し、ルート要素を返します。

    このメソッドは、テンプレート化されたコントロールのコンストラクターによって呼び出される必要があるため、 このメソッドを使用することができません。 また、テンプレートのパーツを対応するコントロールのメンバに連結します。

    以下のサンプルコードは、InputNumber コントロールのインスタンスにテンプレートを適用します。 このテンプレートには、'wj-part'属性が'input'、'btn-inc'、および'btn-dec'に設定された要素を含める必要があります。 コントロールのメンバである'_tbx'、'_btnUp'、'_btnDn'には、これらの要素への参照が割り当てられます。

    this.applyTemplate('wj-control wj-inputnumber', templateString, {
  _tbx: 'input',
  _btnUp: 'btn-inc',
  _btnDn: 'btn-dec'
}, 'input');

    @param classNames コントロールのホスト要素に追加するクラスの名前。 @param template コントロールのテンプレートを定義するHTML文字列。 @param parts パーツ変数とその名前のディクショナリー。 @param namePart ホスト要素にちなんで名付けられたパーツの名前。 これにより、コントロールがフォームで使用されたときにデータをどのように送信するかが決まります。

    引数

    • classNames: string
    • template: string
    • parts: Object
    • オプション namePart: string

    戻り値 HTMLElement

beginUpdate

  • beginUpdate(): void

  • 次にendUpdate が呼び出されるまで通知を中断します。

    戻り値 void

containsFocus

  • containsFocus(): boolean

  • このコントロールにフォーカスのある要素が含まれているかどうかをチェックします。

    戻り値 boolean

deferUpdate

  • deferUpdate(fn: Function): void

  • beginUpdate/endUpdate ブロック内で関数を実行します。

    この関数の実行が完了するまでコントロールは更新されません。 このメソッドは、関数が例外を生成した場合でも endUpdate が呼び出されるようにします。

    引数

    • fn: Function

      実行する関数。

    戻り値 void

dispose

  • dispose(): void

  • ホスト要素との関連付けを解除することによってコントロールを破棄します。

    なお、Wijmoのdispose メソッドでは、JavaScript APIが提供する「addEventListener」で追加されたイベントリスナーは破棄されません。 しかし、メモリの破棄はブラウザ（エンジン）が使用しているガベージコレクションメカニズムに依存します。

    WijmoのdisposeメソッドはグリッドのhostElementのinnerHTMLを削除するため、disposeメソッドを呼び出すことで、 ブラウザのガベージコレクションメカニズムに応じてすべてのイベントリスナーがメモリから削除されます。

    例

    flexGrid.dispose();

    戻り値 void

endUpdate

  • endUpdate(): void

  • beginUpdate の呼び出しによって中断された通知を再開します。

    戻り値 void

focus

  • focus(): void

  • このコントロールにフォーカスを設定します。

    戻り値 void

getTemplate

  • getTemplate(): string

  • コントロールのインスタンスの作成に使用されたHTMLテンプレートを取得します。

    このメソッドは、クラス階層をさかのぼってコントロールのテンプレートを指定する最も近い祖先を探します。 たとえば、ComboBox コントロールのプロトタイプを指定した場合、 そのプロトタイプによってDropDown 基本クラスで定義されたテンプレートがオーバーライドされます。

    戻り値 string

hasOwnProperty

  • hasOwnProperty(v: PropertyKey): boolean

  • オブジェクトが指定されたプロパティを持つかどうかを判定します。

    引数

    • v: PropertyKey

      プロパティの名前。

    戻り値 boolean

initialize

  • initialize(options: any): void

  • 指定したオブジェクトからプロパティをコピーしてコントロールを初期化します。

    このメソッドを使用すると、各プロパティの値をコードで設定する代わりにプレーンなデータオブジェクトを使用してコントロールを初期化できます。

    例: 

    grid.initialize({
  itemsSource: myList,
  autoGenerateColumns: false,
  columns: [
    { binding: 'id', header: 'Code', width: 130 },
    { binding: 'name', header: 'Name', width: 60 }
  ]
});

// 以下と同等です。
grid.itemsSource = myList;
grid.autoGenerateColumns = false;
// など

    初期化データは適用時に型チェックされます。 初期化オブジェクトに不明なプロパティ名または無効なデータ型が含まれている場合、このメソッドは例外を発生します。

    引数

    • options: any

      初期化データを含むオブジェクト。

    戻り値 void

invalidate

  • invalidate(fullUpdate?: boolean): void

  • 非同期更新を発生させるため、コントロールを無効にします。

    引数

    • オプション fullUpdate: boolean

      内容だけでなくコントロールのレイアウトも更新するかどうか。

    戻り値 void

isPrototypeOf

  • isPrototypeOf(v: Object): boolean

  • オブジェクトが別のオブジェクトのプロトタイプチェーンに存在するかどうかを判定します。

    引数

    • v: Object

      プロトタイプチェーンが判定される別のオブジェクト。

    戻り値 boolean

onGotFocus

  • gotFocus イベントを発生させます。

    引数

    戻り値 void

onInvalidInput

  • invalidInput イベントを発生させます。

    イベントハンドラーがイベントをキャンセルした場合、コントロールは無効な入力内容とフォーカスを保持します。

    引数

    戻り値 boolean

onLostFocus

  • lostFocus イベントを発生させます。

    引数

    戻り値 void

onRefreshed

  • refreshed イベントを発生させます。

    引数

    戻り値 void

onRefreshing

  • refreshing イベントを発生させます。

    引数

    戻り値 void

propertyIsEnumerable

  • propertyIsEnumerable(v: PropertyKey): boolean

  • 指定されたプロパティが列挙可能かどうかを判断します。

    引数

    • v: PropertyKey

      プロパティの名前。

    戻り値 boolean

refresh

  • refresh(fullUpdate?: boolean): void

  • コントロールを更新します。

    引数

    • オプション fullUpdate: boolean

      内容だけでなくコントロールのレイアウトも更新するかどうか。

    戻り値 void

removeEventListener

  • removeEventListener(target?: EventTarget, type?: string, fn?: any, capture?: boolean): number

  • このControl が所有する要素にアタッチされている1つまたは複数のイベントリスナーを解除します。

    引数

    • オプション target: EventTarget

      イベントのターゲット要素。 nullの場合、すべてのターゲットにアタッチされているリスナーが解除されます

    • オプション type: string

      イベントを指定する文字列。 nullの場合、すべてのイベントにアタッチされているリスナーが解除されます。

    • オプション fn: any

      削除するハンドラ。 nullの場合は、すべてのハンドラが削除されます。

    • オプション capture: boolean

      リスナーがキャプチャリスナーかどうか。 nullの場合、キャプチャリスナーと非キャプチャリスナーの両方が解除されます。

    戻り値 number

    削除されたリスナーの数。

toLocaleString

  • toLocaleString(): string

  • 現在のロケールを使用して文字列に変換された日付を返します。

    戻り値 string

toString

  • toString(): string

  • オブジェクトの文字列表現を返します。

    戻り値 string

valueOf

  • valueOf(): Object

  • 指定されたオブジェクトのプリミティブ値を返します。

    戻り値 Object

静的 disposeAll

  • disposeAll(e?: HTMLElement): void

  • HTML要素に含まれるすべてのWijmoコントロールを破棄します。

    引数

    • オプション e: HTMLElement

      コンテナー要素。

    戻り値 void

静的 getControl

  • getControl(element: any): Control

  • 指定したDOM要素でホストされているコントロールを取得します。

    引数

    • element: any

      コントロールをホストするDOM要素、またはホスト要素のCSS セレクター（例: '#theCtrl'）。

    戻り値 Control

静的 invalidateAll

  • invalidateAll(e?: HTMLElement): void

  • 指定したHTML要素に含まれるすべてのWijmoコントロールを無効化します。

    このメソッドは、コントロールの表示状態やサイズを変更する 動的なパネルをアプリケーションで使用している場合に使用します。 たとえば、スプリッタ、アコーディオン、およびタブコントロールは通常、 その中の要素の表示状態を変更します。この場合、その要素に含まれるコントロールに通知しないと、 それらのコントロールが適切に機能しなくなる可能性があります。 これが起こる場合は、動的コンテナーで適切なイベントを処理し、 Control.invalidateAll メソッドを呼び出してコンテナー内のWijmoコントロールの レイアウト情報が適切に更新されるようにする必要があります。

    引数

    • オプション e: HTMLElement

      コンテナー要素。nullに設定すると、ページ上に存在するすべてのWijmoコントロールが無効化されます。

    戻り値 void

静的 refreshAll

  • refreshAll(e?: HTMLElement): void

  • HTML要素で存在するすべてのWijmoコントロールを更新します。

    コントロールが時間おいて更新される代わりに直ちに更新されること以外はinvalidateAll メソッドと同様です。

    引数

    • オプション e: HTMLElement

      コンテナー要素。nullに設定すると、ページ上に存在するすべてのWijmoコントロールが無効化されます。

    戻り値 void

イベント

gotFocus

gotFocus: Event<Control, EventArgs>

コントロールがフォーカスを取得したときに発生します。

invalidInput

invalidInput: Event<Control, CancelEventArgs>

無効な文字が入力されたときに発生します。

ユーザーが入力した値が適切な種類に変換できない値、または有効な範囲外の値を貼り付ける場合、 無効な入力エラーが発生する場合があります。

イベントハンドラーがイベントをキャンセルする場合、 ユーザーがエラーを修正できるように、 コントロールは無効なコンテンツとフォーカスを保持します。

イベントがキャンセルされない場合、コントロールは無効な入力エラーを無視し、 元のコンテンツを保持します。

lostFocus

lostFocus: Event<Control, EventArgs>

コントロールがフォーカスを失ったときに発生します。

refreshed

refreshed: Event<Control, EventArgs>

コントロールが内容を更新した後で発生します。

refreshing

refreshing: Event<Control, EventArgs>

コントロールが内容を更新する直前に発生します。