[Input]入力エラーをリアルタイムに通知する方法

文書番号 : 81364     文書種別 : HowTo
登録日 : 2015/06/17     最終更新日 : 2015/06/17

対象製品

Wijmo 5

詳細

Wijmo 5では入力エラーを通知する方法は提供されていません。独自の入力チェックを行い、それを通知する場合はイベントをハンドリングして独自に実装する必要があります。
このサンプルでは以下の方法で特定条件の値が入力された場合にスタイルの変更とツールチップによりエラーを通知する方法を紹介します。

  • イベントハンドリング:検証ロジックおよびエラー処理の実装(textChangedイベント)
  • エラー通知の設定:エラー通知用CSSの設定
  • エラー通知用のViewオブジェクト配置:spanタグ等を活用してエラーメッセージを配置

※AngularJSを利用している場合はAngularJSが提供するngModelを活用することで入力チェックおよびエラー情報の通知を行うことが可能です。
ngModelを活用したサンプル

サンプル