Ajaxフレームワーク ユーザーズガイド

F.10.1 モデルバインディング定義

モデルバインディング定義では、画面部品のプロパティのバインディングを設定します。

設計ビューで画面部品を選択し、コンテキストメニューの[モデルバインディング定義]コマンドを選択すると、[モデルバインディング定義]ダイアログボックスが表示されます。
[モデルバインディング定義]ダイアログボックスでは、以下のモデルバインディングを定義することができます。

• 画面部品とモデルのバインディング
• 画面部品と画面部品のバインディング

モデルバインディング定義で定義した内容は、ソースビューおよびプロパティビューに反映されます。

■画面部品とモデルのバインディング

以下に、[モデルバインディング定義]ダイアログボックスで、画面部品とモデルのバインディングを定義する例を示します。[モデルバインディング定義]ダイアログボックスでは、モデルバインディング定義を編集および削除することもできます。

以下の表に、[モデルバインディング定義]ダイアログボックスの項目を説明します。

項目	説明
画面部品ID	選択した画面部品のIDが表示されます。IDが指定されていない場合は、何も表示されません。この項目は編集できません。
プロパティ名	画面部品のプロパティ名が表示されます。
バインディング先	画面部品のバインディング先が表示されます。
方式	バインディング方式が表示されます。 1: 画面部品とモデルのバインディング 2: 画面部品と画面部品のバインディング
[追加]ボタン	[画面部品のバインディング]ダイアログボックスを表示し、ダイアログボックスで指定されたプロパティ名、およびモデルとユーザログジックをバインディング先として追加します。
[編集]ボタン	[画面部品のバインディング]ダイアログボックスを表示し、選択された行のプロパティ名、バインディング先をダイアログボックスで指定されたプロパティ名、モデルとユーザログジックに変更します。
[削除]ボタン	選択された行を削除します。

上記の[モデルバインディング定義]ダイアログボックスで[追加]ボタンをクリックすると、[画面部品のバインディング]ダイアログボックスが表示されます。

[画面部品のバインディング]ダイアログボックスで、以下の項目を指定します。

項目	説明
バインディング方式	バインディング方式を選択します。 ここでは、“画面部品とモデルのバインディング”を選択します。
プロパティ名	バインディングできるプロパティ名が候補として表示されるので、その中から選択します。
モデル	同じ画面で定義されたモデルが候補として表示されるので、その中から選択します。直接入力することもできます。
ユーザロジック	モデルに指定されたオブジェクトのデータメンバを選択します。

この例では、プロパティ名に“value”を、モデル名に“myModel”を、ユーザロジックに“string1”を選択します。

上記の[画面部品のバインディング]ダイアログボックスで[OK]をクリックすると、設定したプロパティ名、およびモデルとユーザログジックがバインディング先として、以下のように[モデルバインディング定義]ダイアログボックスに反映されます。

この例では、IDがmyTextInputというTextInput画面部品の値(rcf:value)に、IDがmyModelというモデルのstring1プロパティをバインディングします。

このとき、ソース上には以下の定義が生成されます。

<div 
    rcf:id="myTextInput"
    rcf:type="TextInput"
    rcf:value="{myModel.string1}">
</div>

■画面部品と画面部品のバインディング

以下に、[モデルバインディング定義]ダイアログボックスで、画面部品と画面部品のバインディングを定義する例を示します。[モデルバインディング定義]ダイアログボックスでは、モデルバインディング定義を編集および削除することもできます。

以下の表に、[モデルバインディング定義]ダイアログボックスの項目を説明します。

項目	説明
画面部品ID	選択した画面部品のIDが表示されます。IDが指定されていない場合は、何も表示されません。この項目は編集できません。
プロパティ名	画面部品のプロパティ名が表示されます。
バインディング先	画面部品のバインディング先が表示されます。
方式	バインディング方式が表示されます。 1: 画面部品とモデルのバインディング 2: 画面部品と画面部品のバインディング
[追加]ボタン	[画面部品のバインディング]ダイアログボックスを表示し、ダイアログボックスで指定されたプロパティ名、および他画面部品IDと他プロパティ名をバインディング先として追加します。
[編集]ボタン	[画面部品のバインディング]ダイアログボックスを表示し、選択された行のプロパティ名、バインディング先をダイアログボックスで指定されたプロパティ名、他画面部品IDと他プロパティ名に変更します。
[削除]ボタン	選択された行を削除します。

上記の[モデルバインディング定義]ダイアログボックスで[追加]ボタンをクリックすると、[画面部品のバインディング]ダイアログボックスが表示されます。

[画面部品のバインディング]ダイアログボックスで、以下の項目を指定します。

項目	説明
バインディング方式	バインディング方式を選択します。 ここでは、“画面部品と画面部品のバインディング”を選択します。
プロパティ名	バインディングできるプロパティ名が候補として表示されるので、その中から選択します。
他画面部品ID	画面部品IDが候補として表示されるので、その中から選択します。直接入力することもできます。
他プロパティ名	選択した画面部品のバインディング可能なプロパティが表示されるので、その中から選択します。

この例では、プロパティ名に“value”を、他画面部品IDに“myTextArea”を、他プロパティ名に“value”を選択します。

上記の[画面部品のバインディング]ダイアログボックスで[OK]をクリックすると、設定したプロパティ名、および他画面部品IDと他プロパティ名がバインディング先として、以下のように[モデルバインディング定義]ダイアログボックスに反映されます。

この例では、IDがmyTextInput1という画面部品の値(rcf:value)と、IDがmyTextAreaという画面部品の値(rcf:value)をバインディングします。

このとき、ソース上には以下の定義が生成されます。

<div 
    rcf:id="myTextInput1"
    rcf:type="TextInput"
    rcf:value="{myTextArea.value}">
</div>