データバインディング
Binding and Iterator tags
バインディングは、データソースとクエリ文字列をバインドターゲット (UI DOM の属性またはノード) に接続するためのマップを定義し、データソースから送られるデータに適用するフォーマッタとバリデータを指定します。
バインディング タイプ
データ サービス プラグインのバインディングと反復処理では、次のバインディングタイプがサポートされています。
バインディング タイプ | 説明 |
ONE_TIME | データ ソースから値を取得し、ターゲット プロパティを初期化します。 |
ONE_WAY | データ ソースから値を取得し、ターゲット プロパティを初期化します。ソースの値が変更されたら、ターゲット プロパティを再度初期化します。 |
データソースでサポート対象のバインディングタイプを指定することができます。すべてのデータソースは、少なくとも ONE_TIME バインディングをサポートする必要があります。
binding タグ
bindingタグを使用すると、データソースへの定義済みバインディングを作成できます。この定義済みバインディングを使用すると、バインディング宣言で定義を何度も記述することなく、UI の複数のターゲットに共通の値をバインドできます。
属性 | 説明 | 必須/省略可能 |
id | システム全体で一意な値を使用し、バインディングを一意に識別します。 | 必須 |
dataSource | dataSource を一意に識別します。 また、インターフェイスにバインドする反復子を識別します。 | 必須 |
select | データ ソースに固有のクエリ文字列を指定します。 | 必須 |
type | 設定可能な値: ONE_TIME、ONE_WAY デフォルト: ONE_TIME | 省略可能 |
formatter | 生データを表示前にフォーマット設定するために使用するフォーマッタの ID です。 複数のフォーマッタが必要な場合は、それらのフォーマッタを連結することができます。 | 省略可能 |
defaultValue | テキスト ノードまたは属性値を解決するときに返す値です。この値は、データ ソースがデータの取得を完了するまで存在します。 | 省略可能 |
使用方法
bindingタグを使用したデータのバインディング
データをバインドするには、バインディングを宣言し、1 つ以上のユーザーインターフェイスコンポーネントに関連付ける必要があります。UI DOM 内の任意の子テキストまたは属性値にデータをバインドすることができます。
次の例では、customers ルート ノードの下にある customer 要素の数を数えるバインディングを宣言します。さらに、データを表示前に変更するフォーマッタを参照します。
<binding id="customer-count" dataSource="customers" select=”count(/customers/customer)” formatter="customers" type="ONE_WAY" />
このバインディングを使用するには、次の操作を実行します。
UI ドキュメント内の、通常は実際のデータを配置する位置に、データバインディングへの参照を配置します。次の例では、customer 要素の数を含むラベルを表示します。
<label text="{ bind( binding://customer-count ) }" />
複数のコントロールを同じデータ ソースにバインドすることができます。データソースが更新されると、ONE_WAY タイプのバインディングも更新されます。
反復子
反復子を使用すると、データ セットに基づいて複雑な UI 構造を柔軟に作成することができます。この機能を使用すると、リスト ボックス、コンボ ボックス、テーブル、チャートなどの複雑な集合型 UI コンポーネントを構成できます。
反復処理を実行するには、iterator タグを使用します。
属性 | 説明 | 必須/省略可能 |
| dataSource | dataSource を一意に識別します。定義済みの dataSource の ID または任意の祖先反復子の名前を指定することができます。この属性を指定しない場合、反復子は直近の親反復子に対して相対的になります。 | 省略可能 |
select | データ ソースに固有のクエリ文字列です。 | 必須 |
type | 設定可能な値: ONE_TIME、ONE_WAY デフォルト: ONE_TIME | 省略可能 |
name | コ ンテキスト内の反復子を指定します。この反復子は、サブ反復子で dataSource 参照として使用でき、宣言をバインドします。開発者は反復子に dataSource ID と同じ名前を付けないように注意する必要があります。その場合、ほとんどの状況で予期せぬ結果が生じます。 | 省略可能 |
反復子を使用すると、dataSource から取得したＤａｔａＳｅｔ をループ処理し、iterator タグ定義の内容をセット内の各アイテムの場所で複製し、DataSet 内のアイテムを iterator タグの親の反復子の位置に追加することができます。
さらに、入れ子になった反復処理を実行することも可能です。
使用方法
反復子を使用したバインディング
この例では、テーブルを作成してＤａｔａＳｅｔ を反復処理し、各エントリの行を作成します。
<table>
<column><header name="First Name" /></column>
<column><header name="Last Name" /></column>
<column><header name="Phone Number" /></column>
<iterator dataSource="customers" select="/customers/customer" type="ONE_WAY" />
<row>
<cell text="{ *('firstName') }" /> <!--refers to parent iterator -->
<cell text="{ *('lastName') }" /> <!--refers to parent iterator -->
<cell text="{ *('phoneNumber') }" /> <!--refers to parent iterator -->
</row>
</iterator>
</table>
Data Service Binding
Platform 4.2+ が必要
データ サービス プラグインが必要
DataService のシンタックス
このドキュメントでは、com.nexaweb.data.DataService インターフェイスを使用してデータを UI にバインドするための宣言型シンタックスについて説明します。com.nexaweb.data.DataService インターフェイスは、プラグインを通じて提供されるシステム サービスです。詳細については、データ サービス プラグイン API の javadoc を参照してください。
"DataService" システム サービスを使用してデータを UI にバインドするために、以下のメソッドが公開されています。
重要: 以下のメソッドは、テキスト解決シンタックスで使用したり、メソッド呼び出しの引数として使用したりできる、汎用のオブジェクトを返します。
DataService.bind( 'bind-string' )
指定された bind-string を使用してバインドします。
bind-string: セミコロンで区切られたパラメータのリスト
パラメータのフォーマット: 等号で区切られた名前と値のペア (名前=値)
次の表に、bind-string でサポートされるパラメータを示します。
| パラメータ | 説明 | 必須 |
| type | バインディング タイプ: ONE_TIME または ONE_WAY 指定しない場合は、デフォルトで ONE_TIME になります。 | 省略可能 |
| dataSource | データ ソースの ID です。反復ループのコンテキストでは、祖先反復子の名前になることがあります。指定しない場合、親反復子に対して相対的に選択が実行されます。 | 必須 |
| defaultValue | データが使用不可であるか、Null である場合に返される値です。 | 省略可能 |
| formatter | データを UI でのプレゼンテーション用に変更するために使用するフォーマッタです。 |
例
<label text="{ bind('dataSource=myDataSource; select=/customers/customer[0]@name; type=ONE_WAY') }"/>
登録されているショートカット
bind
bind=DataService.bind
DataService.bind( binding://binding-id )
ID が binding-id であるバインディング定義を使用してバインドします。
例
<label text="{ bind(binding://myBinding) }"/>
登録されているショートカット
bind
bind=DataService.bind
DataService.relativeBind( 'select' )
指定された select 文字列を使用してバインドします。バインディングは、最も近い祖先反復子のデータ ソースに対して実行され、現在の反復データが選択のコンテキストとして指定されます。
例
<data:iterator dataSource="myDataSource" select="/customers" xmlns:data="http://openxal.org/core/data">
<label text="{ *('customer[0]@name') }"/>
</data:iterator>
Registered Shortcut
*
* は DataService.relativeBind を表します
DataService.relativeBind( 'iteratorNameOrDataSourceId', 'select' )
指定された select 文字列を使用してバインドします。バインディングは、iteratorNameOrDataSourceId という名前の祖先反復子の現在の反復に対して相対的に実行されるか、ID が iteratorNameOrDataSourceId である指定されたデータ ソースに対してコンテキストを使用せずに直接実行されます。
例:
<data:iterator name="topIterator" dataSource="myDataSource" select="/customers" xmlns:data="http://openxal.org/core/data">
label text="{ *('topIterator', 'customer[0]@name') }"/>
</data:iterator>
登録されているショートカット
*
* は DataService.relativeBind を表します