第6章

フォームデザイナ

この章では、Novell exteNd Directorフォームデザイナを紹介し、XForms 1.0準拠のWebフォームを作成する方法を説明します。トピックは次のとおりです。

XFormsについて

XFormsでは、Webフォームを定義するための、強力で標準ベースの方法が用意されています。 XForms標準の特長として、次の点が挙げられます。

独立したデータ、ロジック、および表示モジュール
強力なイベントモデル(その結果、クライアント側で検証または計算する際に、大量のスクリプトの使用は不要)
XMLデータの処理方法の1つ

XFormsは、スタンドアロンアプリケーションとしては稼動できません。 XHTMLのようなホスト言語内部でコンポーネントとして稼動するように設計されています。 Novellの実装では、ページフローアプリケーションのコンテキスト内部で稼動します。

フォームデザイナについて

フォームデザイナには、XForms 1.0準拠のWebフォームに対応したグラフィカルな開発環境が装備されています。

フォームデザイナは、3つのタブで構成されています。

タブ	説明
フォーム	フォームのユーザインタフェースの定義に使用します。次の処理をグラフィカルに実行できます。フォームコントロールをレイアウトしたり、スタイル設定したりするフォームコントロールをデータにバインドするフォームコントロールのイベントとアクションを定義する詳細については、表示の定義を参照してください。
モデル	フォームのモデル要素の定義に使用します。次の操作を実行できます。モデルを作成、編集するインスタンスデータを作成、編集するデータ制限を設定する詳細については、モデル要素の操作を参照してください。
ソース	強力なXMLソースエディタを起動します。 XMLエディタでの作業の詳細については、『ユーティリティツール』のXMLエディタに関する章を参照してください。
XFormsプレビュー	フォームをテストモードで実行できます。詳細については、フォームのテストを参照してください。

フォームデザイナの起動と停止

フォームデザイナを起動する

既存のフォームを開きます(次の既存のフォームを開くを参照)。

または
フォームを新規に作成します(フォームの作成を参照)。

Procedure 既存のフォームを開く

［ファイル］>［開く］の順に選択します。
既存のフォームがある場所に移動します(通常はプロジェクトの\data\formディレクトリ)。
フォームのファイルをクリックして、［開く］を選択します (または、フォームをダブルクリックします)。

フォームの作成

フォームウィザードを使用して、初期のバインドされていないフォーム、または次のものをベースにしたデータにバインドされたフォームを作成します。

スキーマ
サンプルのXMLデータ(インスタンスデータ)

その他の方法入出力フォームを内蔵した完全なページフローを他のソースから作成するには、別のウィザードを起動します。ページフローアプリケーションの範囲内でXFormsを生成する、別ウィザードの起動の詳細については、、、およびを参照してください。

Procedure フォームウィザードでフォームを作成する

exteNd Directorプロジェクトを開きます。

ヒント: リソースセットがあるプロジェクトを開いていないと、フォームウィザードを起動できません。
［ファイル］>［新規作成］の順に選択します。
［ポートレット］タブで、［フォーム］を選択し、［OK］をクリックします (または、［フォーム］をダブルクリックします)。

フォームウィザードの最初のパネルが表示されます。

次のオプションを指定します。

オプション	操作内容
フォーム名	フォームの名前を指定します。拡張子は指定する必要はありません。
CSSレイアウトの使用	ウィザードでコントロールをフォームにレイアウトするために絶対配置方式を利用する場合は、このチェックボックスをオンにします。それ以外ではオフにします。 CSSレイアウトを使用しない場合、絶対配置方式は利用できません。ウィザードでCSSレイアウトを使用する方法の詳細については、ウィザード生成によるフォームについてを参照してください
標準ポートレットCSSクラス	ウィザードでフォントと色に対してWSRP CSSクラスを使用する場合は、このチェックボックスをオンにします (デフォルト設定は、Common\Resources\CSSClassificationsディレクトリにあるwsrp-classifications.xmlファイルで定義されています)。オンの場合、これらのクラスは、ランタイム時にページのスタイル設定のポータルテーマファイルと連携して使用されます。独自にフォントと色を定義する場合は、オフにします。

オプション

操作内容

フォーム名

フォームの名前を指定します。拡張子は指定する必要はありません。

CSSレイアウトの使用

ウィザードでコントロールをフォームにレイアウトするために絶対配置方式を利用する場合は、このチェックボックスをオンにします。それ以外ではオフにします。

CSSレイアウトを使用しない場合、絶対配置方式は利用できません。

For more information ウィザードでCSSレイアウトを使用する方法の詳細については、ウィザード生成によるフォームについてを参照してください

標準ポートレットCSSクラス

ウィザードでフォントと色に対してWSRP CSSクラスを使用する場合は、このチェックボックスをオンにします (デフォルト設定は、Common\Resources\CSSClassificationsディレクトリにあるwsrp-classifications.xmlファイルで定義されています)。

オンの場合、これらのクラスは、ランタイム時にページのスタイル設定のポータルテーマファイルと連携して使用されます。

独自にフォントと色を定義する場合は、オフにします。

［次へ］をクリックして続行します。

次のウィザードパネルが表示されます。

.

初期インスタンスデータに、次のファイルタイプのいずれかを指定します。

オプション	操作内容
スキーマ	ウィザードで既存スキーマの要素から、インスタンスデータノードにバインドされたコントロールを生成する場合は、オンにします。各インスタンスデータノードのスキーマタイプは、自動的に指定されます。
サンプルXMLデータ	ウィザードでインスタンスデータノードにバインドされたコントロールを生成する場合は、オンにします。表示データ値のフォーマットを指定する場合は、スキーマタイプ情報を手動で追加する必要があります。
初期インスタンスデータがありません	コントロールにバインドされたデータを持たないXFormsを作成するには、オンにします。
ファイルの指定	スキーマまたはサンプルXMLデータがあるファイルの名前と場所を指定します。参照 - ファイルがディスク上にある場合にオンにします。リソースセット - ファイルが、現在開いているプロジェクト内部のリソースセットにある場合にオンにします。

スキーマを選択すると、このスキーマで定義されるインスタンスデータのルートを、次のペインで指定するよう要求されます。

ドロップダウンリストからルートを選択します。
［次へ］をクリックします。

［次へ］をクリックします。

次のウィザードパネルが表示されます。

次のオプションを指定します。

オプション	操作内容
このページのカラム数を指定してください	ウィザードで生成する、コントロールのカラムの数を指定します。
コントロールに対してラベルを整列させる方法を指定してください	ラベルとコントロールを整列させる方法を指定します。
各カラムの幅を指定してください	各カラムの幅と単位を指定します。ウィザードにより、単位がピクセルに換算されます。
ブラウザで使用するフォントサイズを指定してください	使用するフォントサイズと種類を指定します。
行間隔を指定してください	行の空き具合をピクセル単位で指定します。
ラベルとコントロール間の縦間隔を指定してください	ラベルとコントロールとの空き具合をピクセル単位で指定します。

［完了］をクリックします。
フォームの作成が完了したことを知らせるメッセージが表示されたら、［OK］をクリックします。

結果［完了］をクリックすると、次の処理に必要なマークアップすべてを含むXHTMLファイルが生成されます。

フォームのモデルとインスタンス要素の作成
インスタンスデータの各ノード用に対するデフォルトコントロールの生成とバインド
インスタンスデータの各コンポーネント用のデフォルトコントロール(とラベル)がある、単一の絶対配置領域の生成
- インスタンスデータに同様なチャイルド要素が繰り返し出てくる場合は、デフォルトコントロールを含む繰り返しブロックが生成されます。
ユーザ入力(カラム数、ラベルの表示方法など)に基づく、コントロールのレイアウト

ウィザード生成によるフォームについて

生成されたフォームは、XForms 1.0準拠です。フォームは、XHTMLファイルに格納されます。ウィザードによって生成されたフォームには、それぞれ次のものがあります。

XMLネームスペース宣言

XMLネームスペース宣言は、ファイルの先頭に配置され、次のフォーマットになっています。

  xmlns:xforms="http://www.w3.org/2002/xforms"

XMLネームスペースは、要素が属するXML言語、さらにはXML言語の処理方法も特定します。プレフィックスの具体例は、次のとおりです。

XMLNSプレフィックス	説明
xforms	XFormsの言語要素として処理
ev	XMLイベントの言語要素として処理

手順ウィザードにより追加されたネームスペースを変更する必要はありません。アプリケーション次第では、新たにネームスペース宣言を追加する必要があります。

XFormsのモデル要素

XFormsのモデル要素は、XHTMLドキュメントの<head>内に配置されます。モデル要素により、次の項目が定義されます。

ユーザに対して表示されたり、ユーザが入力したりするデータの構造
送信するデータの構造
フォームコントロールを初期化するデータ
ユーザデータを検証するルール

ウィザードで生成されたモデル要素には、たとえば次のように「_wsrp_rewrite_」を含む名前付きのid属性があります。

  <xforms:model
     id="model1_wsrp_rewrite_">

モデルが1つしかない場合はモデルIDは必須ではありませんが、フォームウィザードにより常に生成されます。ウィザード生成のモデルIDには、常にwsrp_rewriteトークンが含まれます。 wsrp_rewriteトークンは、ランタイム時に固有な名前で置換されます。そのため、ランタイム環境は、単一のページ内で稼動している複数のフォームとモデルを管理できます。

手順［モデル］タブを使用してインスタンスデータ、送信要素、およびモデル項目のプロパティを定義できます。 wsrp_rewriteトークンの置換は、ランタイム環境により管理されます。

XForms: アクション要素

モデル要素内に、事前定義されたXFormsの<action>要素が2つあります。これには、XFormsのイベントハンドラが2つ含まれています。この2つのイベントハンドラは、送信エラーとデータ検証エラーのためのデフォルトのハンドラです。

送信時にエラーが起きると、ユーザにフィードバックを送信します。このイベントハンドラの目的は、フォームに何か失敗があった場合、なんらかの症状を起こさせることです。次のように表示されます。

  <xforms:action ev:event="xforms-invalid" ev:observer="div_wsrp_rewrite_">
  <xforms:message level="modal">The data is invalid. Please check it    and try again.</xforms:message>
  </xforms:action>
  
  <xforms:action ev:event="xforms-submit-error">
  <xforms:message level="modal">Submission error. Please check the
     data and try again.</xforms:message>
  </xforms:action>

手順必須のアクションはありませんが、フォームにこの機能が不要と判断される場合は、イベントハンドラを変更するか削除できます。

<style>要素

フォーム生成時にCSSレイアウトを使用する場合、生成されたページのスタイル設定情報は、CSSスタイル設定ルールに含まれます。このルールは、XHTMLファイルの<head>内にある<style>要素にあります。 CSSスタイルルールは、XHTMLファイルからリンクを通じて参照される外部ファイルに格納することもできます。

注記: ウィザードでのフォーム生成時に、CSSスタイル設定を使用しないように指定した場合、生成されたフォームには、スタイルノードが含まれません。

次の条件が、フォームのXFormsコントロールすべてに適用されます。

各コントロールの条件	詳細
レイアウト領域に配置されます。	レイアウト領域は、XHTMLページでのXFormsコントロールのコンテナになります。コントロールをより正確に配置できます。レイアウト領域の幅はどこも同じでなければならず、これは、フォームの単一のセレクタで定義されます。セレクタは、次のとおりです。 nv-block-width_wsrp_rewrite_ レイアウト領域にはそれぞれ、高さを個別に定義するルールがあります。
「.nvP」で始まり後に番号が続く、クラス属性に割り当てられます。	番号は連番です。各コントロール名にも、トークンの「_wsrp_rewrite_」が含まれています。このトークンは、ランタイム時に置換され、単一ページに複数のフォームが存在する場合に、コントロール名が固有であることを保障するために使用されます。
CSSボックスモデルとCSS擬似要素 ::値に従って、スタイル設定されます。	コントロールには、次の3種類があります。 <repeat>のような、ラベルなしタイプ <trigger>のような、一体型のラベルを持つタイプ <input>のような、ラベルをテキストフィールドから独立して配置できるタイプ
	一体型のラベルを持つコントロールには、セレクタが1つ与えられます。たとえば、次のとおりです。 .nvP4_wsrp_rewrite_ { position : absolute; left : 10px; top : 91px; width : 67px; height : 25px;
	独立型のラベルを持つコントロールには、セレクタが3つ与えられます。たとえば、次のとおりです。 1つはラッパー用に .nvP1_wsrp_rewrite_ { display : block; } 1つはコントロールのラベル用に .nvP1_wsrp_rewrite_ xforms\|label { display : block; position : absolute; left : 10px; top : 1px; width : 73px; height : 20px; } 1つはコントロールのデータ領域用に .nvP1_wsrp_rewrite_::value { display : block; position : absolute; left : 88px; top : 1px; width : 88px; height : 20px;

手順デフォルトのCSSスタイル設定ルールを変更するには、次の手順を実行します。

独自のスタイルシートを作成し、フォームに添付します。
定義済みのクラススタイルに追加するか、またはクラススタイルを変更します。

For more information 詳細については、CSSスタイルマネージャの使用を参照してください。

フォームの保存

Procedure フォームを保存する

ツールバーの［保存］アイコンをクリックします。

または
［ファイル］>［保存］の順に選択します。

表示の定義

ユーザインタフェースを定義するには、［フォーム］タブにあるツールを使用します。この節では、［フォーム］タブの使用方法について説明し、次のトピックについて取り扱います。

［フォーム］タブについて

［フォーム］タブを使用すると、ユーザインタフェースを構成している、フォームコントロールをグラフィカルに作成し、操作できます。［フォーム］タブは次のようになっています。

FormDesignerMainPanes

［フォーム］タブには、次の機能があります。

ツール	説明
視覚エディタ	フォームコントロールをグラフィカルに作成して操作するには、視覚エディタを使用します。このエディタには、次に示すタブ付きツールバーがあります。［XForms］ツールバー - フォームにドロップできるコントロールとブロックのセット。［整列/配置］ツールバー - 選択されたコントロールの整列方法(左/右)または配置方法(垂直/水平)を変更できます。
インスタンスデータペイン	インスタンスノードをフォームコントロールにバインドするには、インスタンスデータペインを使用します。［フォーム］タブのインスタンスデータペインを使用してインスタンスデータの構造を変更することはできません。構造の変更には、［モデル］タブのインスタンスデータペインを使用します。
プロパティインスペクタ	現在選択しているコントロールでCSSとデータのバインディングプロパティを操作するには、プロパティインスペクタを使用します。プロパティインスペクタの使用方法の詳細については、フォームコントロールのプロパティの設定を参照してください。
イベントエディタ	フォームコントロールに対してイベントとアクションを定義するには、イベントエディタを使用します。詳細については、モデル要素の操作モデルのイベントとアクションを定義するには、［モデル］タブを使用します。詳細については、モデル要素の操作を参照してください。

［フォーム］タブの制限事項

編集できるのは、ページのレイアウト領域にあるフォームコントロールだけです。視覚エディタを使用してページのXHTMLを編集することはできません。 XHTMLタグが展開されてその内容が表示されることはありません。表示されるのは、タグ自体だけです。フォームコントロールをXHTMLタグに挿入することはできません。

ショートカットキー

視覚エディタでは、次のショートカットキーを使用できます。

キー操作	説明
Ctrl+X	切り取り
Ctrl+C	コピー
Ctrl+V	貼り付け
Delete	削除
矢印キー(上下左右)	選択対象を、矢印の向きに5ピクセル移動
Ctrl+矢印キー(Ctrl+右向き矢印など)	選択対象を、矢印の向きに1ピクセル移動
Shift+矢印キー(Shift+右向き矢印など)	選択対象を、矢印の向きに5ピクセル伸張
Ctrl+Shift+矢印キー(Ctrl+Shift+右向き矢印など)	選択対象を、矢印の向きに1ピクセル伸張

フォームコントロールについて

フォームデザイナでは、XForms 1.0仕様で概要が策定されているXFormsコントロールのすべて、およびフォームデザイナがフォーマット設定の制御に使用している他のコントロールの一部をサポートしています。コントロールには、次のものがあります。

アイコン	コントロール	説明
	XFormsトリガコントロール	標準のXFormsトリガコントロールです。たとえば、フォームのボタンが該当します。ユーザがトリガするアクションが許可されます。
	リンクスタイルのXFormsトリガ	リンクをエミュレートするよう事前設定された、標準のXFormsトリガコントロールです。トリガが、ボタンではなくリンクに見えるようにするため、CSSルールが適用されます。その結果は、次のとおりです。トリガに、DOMActivateイベント(ボタンプレス)がないかリッスンする<xforms:action>イベントハンドラが組み込まれます。アクション要素に、HTTP GET処理を介して新しいページをロードする<xforms:load>要素が盛り込まれます。コントロールのプロパティシートを使用して、GETに使用するURLを指定します。リンクのエミュレート、リンクスタイル、要求タイプ、ターゲットURL、送信も参照してください。
	XForms出力	読み込み専用データをユーザに表示します。このコントロールでは、一部のデータタイプのフォーマットを指定できるフォーマットプロパティをサポートしています。フォーマット設定は、プロパティインスペクタで適用します。
	XFormsテキスト領域	自由形式の複数行コンテンツを入力できます。
	XFormsアップロードコントロール	ファイルをローカルのファイルシステムからアップロードできます。
	XForms入力	単一行の自由形式データを入力できます。このコントロールでは、一部のデータタイプのフォーマットを指定できるフォーマットプロパティがサポートされます。フォーマット設定は、プロパティインスペクタで適用します。詳細については、書式を参照してください。
	XForms範囲	値の連続した範囲から選択できます。
	XFormsシークレット	単一行の自由形式データを入力できます。データを入力すると、文字は別の文字に変更されます。この機能は、パスワードなどの場合に役立ちます。
	XFormsの単一選択	選択肢のセットから項目を1つ選択できます。
	XFormsの複数選択	選択肢のセットから項目を2つ以上選択できます。
	XForms送信ボタン	フォームの内容を送信できる、特殊形式のトリガです。
	XHTMLイメージ	プロジェクトのリソースセットからロードしたXHTMLイメージを表示します。［フォーム］タブモード、およびブラウザでの表示形式モードで表示可能です。
	HTMLコンテンツボックス	スタティックHTMLコンテンツの読み込み専用表示です。
	絶対配置領域	exteNd Directorの拡張機能です。レイアウト管理に使用します。
	XFormsの繰り返し	同様なデータの集まりを表示する場合に使用します。繰り返される要素を管理するには、繰り返しブロックをフォームに追加してから、繰り返されるデータの単一インスタンスを表すコントロールを、繰り返しブロック内に追加します。ランタイム時に、プロセッサは繰り返しコントロールがバインドされている各データ要素ごとに、繰り返しブロックを1回表示します。繰り返されるデータの各インスタンスは、ブロックとして処理されます。各ブロックは、先に処理されたブロックの後に配置されます。繰り返されない、残りのコンテンツはすべて、その下に配置されます。繰り返されないオブジェクトは、次に述べる場所に直接配置することはできません。繰り返しブロック内の繰り返し要素の下繰り返しブロック内の繰り返し要素の右
	Xformsスイッチ	フォームコントロールを条件に応じて処理する場合に使用します。スイッチ要素を使用すると、任意の数のケース要素をチャイルド要素にできます。各ケースはサブフォームを表し、そのうちのいずれかがランタイムプロセッサにより、いつでも正確に表示されます。どのcaseが表示されるのかは、計算結果ではなく、イベントハンドラのアクションによって決まります。フォームデザイナは、スイッチ要素を各ケース要素のレイアウト領域として表示します。スイッチブロック内でのケースステートメントの順序を指定することはできません。もっとも、これは不要です。一度に表示されるのは1件だけだからです。イベントハンドラにより、ユーザが指定するイベントに応じたケースの表示方法が決まります。
	ページフローリンク領域	exteNd Directorの拡張機能です。このコントロールは、ランタイム時に［送信］ボタンに置換されます。詳細については、ボタンリンクを参照してください。

For more information コントロールに対して指定できるプロパティの詳細については、フォームコントロールのプロパティの設定を参照してください。

コントロールの操作

フォームウィザードを使用して初期フォームを生成した後は、フォームのレイアウトとコントロールの表示具合を微調整できます。［フォーム］タブで次の処理ができます。

コントロールの追加と削除

コントロールの追加

フォームにコントロールを追加する方法は、いくつかあります。最初の2つの方法では、バインドされていないコントロールをフォームに追加します。

Procedure バインドされていないコントロールをXFormsツールバーから追加する

ツールバーにあるコントロールタイプをクリックします。
フォームでのコントロールの左上隅とする場所に対応する、レイアウト領域内をクリックします。

Procedure バインドされていないコントロールを、［フォームデザイナ］メニューから追加する

［フォームデザイナ］>［挿入］の順に選択します。
ポップアップメニューからコントロールを選択します。
フォームでのコントロールの左上隅とする場所に対応する、レイアウト領域内をクリックします。

コントロールの削除

コントロールを削除すると、そのラベルも一緒に削除されます。

Procedure コントロールを削除する

コントロールをクリックします。
<削除>キーを押します。

または
［編集］>［切り取り］の順に選択します。

コントロールの移動

Procedure コントロールを移動する

コントロールをクリックします。
移動先にまでドラッグ(または矢印キーを使用して移動)します。

Procedure コントロールを2つ以上移動する

移動する複数のコントロールを、次の方法で選択します。
- 1つめのコントロールをクリックしたら、<Ctrl>キーを押しながら他のコントロールをクリックします。
  
  または
- 選択するコントロールの近くをクリックして箱型にドラッグします。この箱に囲まれたコントロールがすべて選択されます。
コントロールのセットを移動先にドラッグします。

コントロールのサイズ決定

デフォルトでは、コントロールの幅と高さは、自動的にそのコンテンツにふさわしいサイズに調整されるため、事前には指定されていません。正確に幅と高さを指定するには、次の2とおりの方法のいずれかを実行します。

注記: 幅と高さを指定すると、コントロールのコンテンツは、指定サイズに合わせるため折り返されます。実行結果は保証されません。

Procedure フォームコントロールのサイズをグラフィカルに決定する

コントロールをクリックして、ハンドルを表示します。
次の方法でコントロールのサイズを決定します。
- ハンドルを選択して、希望するサイズにドラッグします。
  
  または
- ハンドルを選択したら、<Shift>キーを押しながら、希望する向きの矢印キーを押します。

Procedure プロパティインスペクタを使用して、フォームコントロールのサイズを決定する

コントロールを選択します。
プロパティインスペクタを開き、コントロールの幅と高さを指定します。

コントロールの整列

レイアウト、繰り返し、またはスイッチブロック内のコントロールを整列できます。

Procedure コントロールを整列する

整列の基準点とするコントロール、およびそれに合わせて整列させるいくつかのコントロールを選択します。
［整列］ツールバーから、選択対象に適用する整列方法を選択します。

または
［フォームデザイナ］>［選択されたオブジェクトの整列/配置］の順に選択します。

コントロールのグループ化とグループ解除

コントロールをグループ化すると、次のことができます。

クライアント側のXFormsレンダラにヒントを与え、その結果、関連するコントロールを、携帯電話やPDAなどの機能の限られた機器でまとめて表示できます。
グループ内のコントロールのコンテキストを確立することにより、グループ内でのXPath式を簡潔にできます。
コントロールにコンテナを用意できます。グループ内で継承を介して、このコンテナにCSSスタイルを適用できます。

コントロールをグループ化するためのルール

コントロールをグループ化するためのルールは、次のとおりです。

コントロールは、複数のグループに所属できます。
グループは、厳密にネストする必要があります。つまりグループ全体を、グループ、繰り返し、またはスイッチ/ケースブロックなどの上位レベルのコンテナに組み込む必要があります。
たとえばラベルだけ、ということではなくコントロール全体が、1つのグループに所属します。
グループ使用時には注意してください。フォームデザイナでコントロールのセットをグループ化しても、コントロールを場所的にまとめてロックすることにはなりません。コントロールのセットをグループ解除してから再グループ化すると、情報(インスタンスデータのコンテキスト、グループ要素に添付されたスタイル情報など)が失われます。

これらのルールの大半は、XMLの階層構造的性質のために必要とされます。

Procedure グループを作成する

グループ化するコントロールを選択します。
［フォームデザイナ］メニューから［グループに追加］を選択するか、または右クリックして、ポップアップメニューから［グループに追加］を選択します。
［新規グループ］を選択します。
グループの名前を入力します。

新規グループが作成され、それが現在の選択になります。プロパティインスペクタにより、この選択グループのプロパティが表示されます。グループを選択すると、ページ内のどこにでもドラッグして、グループ内でコントロールを再配置できます。

コントロールをグループ化した場合

グループを作成すると、次の結果が得られます。

新しいグループ要素を作成するようにXMLが再編成されます。この要素のペアレントは、最初に選択したコントロールのペアレントです。
選択されたコントロールは、新しいグループ要素のチャイルドになります。
グループノードをバインドしているノードセットは、インスタンスデータノードに設定されます。このノードは、選択されたコントロールにバインドされているインスタンスデータノードの、「最も近い」先祖になります。
新しいグループにあるコントロールのXPathバインドは、そのノードの親戚になるよう調整されます。
バインド属性を使用しているバインド仕様は、調整されません。

Procedure コントロールをグループに追加する

追加するコントロールを選択します。
［フォームデザイナ］>［グループ］>［グループに追加］の順に選択します。
コントロールの追加先となるグループの名前を選択します。

選択されたコントロールに対して実行するコマンドが後から追加される場合が考えられるため、コントロールを1つ選択したからといって、そのグループ全体が選択された状態になることはありません。コントロールのXML要素は、グループを表すグループ要素の下に移されます。そして、XPathをバインドしているインスタンスデータは、グループ要素にバインドされたノードに対して相対的になるように調整されます。

Procedure グループからコントロールを削除する

削除するコントロールを選択します。
右クリックして、［グループから削除］を選択します(または、［フォームデザイナ］メニューから［グループから削除］を選択します)。
要素を削除するグループを選択します。

コントロールを表すXML要素が、グループ要素から分離され、同レベルのアイテムが作成されます。インスタンスデータのXPath式は、調整されて絶対式になります。グループにコントロールがなくなると、グループ要素がドキュメントから削除されます。

Procedure グループを削除するには:

フォームからグループ(グループに関連付けられたコントロールは除く)を削除するには、次の手順を実行します。
- ［フォームデザイナ］>［グループ］>［グループの削除］の順に選択します。

グループを削除した場合

グループを削除すると、次の結果が得られます。

グループでコントロールを表しているXML要素が、グループ要素から分離され、同レベルのアイテムが作成されます。
グループノードが削除されます。
コントロールのインスタンスデータのXPath式が調整されて、絶対式になります。

コントロールへのスタイルの適用

フォームデザイナには、フォームの表示に使用される色、サイズ、およびフォントを適用するための、デフォルトのスタイルが用意されています。これは、標準ポートレットのCSSクラス定義をベースにしています。スタイルのデフォルトクラス属性は、wsrp-classification.xml (\Common\Resources\CSSClassificationsディレクトリにあります)で定義されています。ランタイム時には、さまざまなポータルテ－マファイルにより、これらのクラス属性、およびいくつかの内部Novellクラス属性に関連付けられたスタイルが定義されます。

CSS分類の変更

ウィザードにより、フォームの各コントロールに対して、クラス属性が生成されます。たとえば、フォームの入力フィールドには、次のような名前が与えられます。

  class=\x94 nvP1_wsrp_rewrite_ portlet-form-input-field\x94

nvp1クラス値は、この要素の絶対配置ルールを指定する内部スタイルノードにある固有なセレクタを参照します。
wsrp_rewriteは、マルチポートレットページのページ上で、コントロールすべてに対して名前が固有になるようにランタイム時に置換されるトークンです。
portlet-form-input-fieldは、外部スタイルシート(通常はポータルテーマファイル)の書式設定ルールを参照するクラス名です。

これらのクラスは、Common\Resources\CSSClassificationsディレクトリにあるWSRP-classification.xmlで定義されています。このファイルは、クラス名を特定のコントロールタイプにマッピングします。これらのクラス名は、ウィザードの最初のページで［標準ポートレットCSSクラス］チェックボックスをオンにすると、ウィザードにより追加されます。

Procedure CSS分類を、これらの値を持たずに生成されたファイルに適用する

［フォーム］タブでフォームを開きます。
［フォームデザイナ］>［CSSの設定を設定］の順に選択します。

［CSS分類を適用する］ダイアログボックスが表示されます。

次のとおりにパネルに入力します。

フィールド	説明
このドキュメントに適用する分類のセットを選択する	WSRPを選択する必要があります。注記: 今後、さらに別の分類セットが追加される可能性があります。
既存のコントロールに新しいクラス値を適用する	新しいクラス値を既存のコントロール、および後で作成される新しいコントロールに追加するには、このボックスをオンにします。
既存のコントロールから古いクラス値を削除する	分類により定義されたクラス値をすべて、フォームコントロールから削除するには、このボックスをオンにします。たとえば、属性 class=\x94 nvP1_wsrp_rewrite_ portlet-form-input-field\x94 \x82 \xf0 \x8e \x9d \x82 \xc1 \x82 \xbd \x83 R\x83 \x93 \x83 g\x83 \x8d \x81 [\x83 \x8b \x82 \xcd \x81 A 次のようになります。 class=\x94 nvP1_wsrp_rewrite_ \x93 このボックスをオンにすると、削除されたクラス値に関連付けられたフォーマットは失われます。

フィールド

説明

このドキュメントに適用する分類のセットを選択する

WSRPを選択する必要があります。

注記: 今後、さらに別の分類セットが追加される可能性があります。

既存のコントロールに新しいクラス値を適用する

新しいクラス値を既存のコントロール、および後で作成される新しいコントロールに追加するには、このボックスをオンにします。

既存のコントロールから古いクラス値を削除する

分類により定義されたクラス値をすべて、フォームコントロールから削除するには、このボックスをオンにします。

たとえば、属性

  class=\x94 nvP1_wsrp_rewrite_ portlet-form-input-field\x94 \x82 \xf0 \x8e \x9d \x82 \xc1 \x82 \xbd \x83 R\x83 \x93 \x83 g\x83 \x8d \x81 [\x83 \x8b \x82 \xcd \x81 A

次のようになります。

  class=\x94 nvP1_wsrp_rewrite_ \x93

このボックスをオンにすると、削除されたクラス値に関連付けられたフォーマットは失われます。

［OK］をクリックします。

CSSスタイルマネージャの使用

CSSスタイルマネージャを使用して、フォームに関連付けられた、内部または外部のCSSスタイルシートをフォームデザイナ内部から編集できます。 CSSスタイルマネージャを使用すると、特定のコントロールとラベルに関連付けられた、背景色、テキスト、およびフォントサイズなどのプロパティを指定できます (フォームデザイナは、コントロールとラベルの配置を直接処理しています。CSSスタイルマネージャではこの機能を実行できません)。

Procedure CSSスタイルマネージャを開く

フォームを開いた状態で、［フォームデザイナ］>［スタイルマネージャ］の順に選択します。

注記: スタイルシートを添付すると、このメインダイアログボックスで［キャンセル］を押しても、完了したアクションはキャンセルできません。

内部と外部のスタイルシートのスタイルルールを作成、編集、および削除するには、CSSエディタを使用します。

For more information 詳細については、『ユーティリティツール』のCSSエディタに関する章を参照してください。

レイアウト領域の操作

フォームコントロールのレイアウトをさらに正確に制御するために、フォームデザイナでは、フォームコントロールをレイアウト領域内部に配置する必要があります。レイアウト領域は、XHTMLページ内でのXFormsコントロールのコンテナになります。他のフォームコントロールと同様に、レイアウト領域を追加、削除、サイズ設定、およびプロパティ設定できます。次のコントロールが、レイアウト領域として機能します。

絶対配置領域
XForms繰り返しコントロール
Xformsスイッチ/ケースコントロール
ページフローリンク領域

レイアウト領域は、視覚エディタの左端にあるガターで区別できます。

frmLayoutGutter

レイアウト領域のプロパティ設定、サイズ変更、または削除のためにコントロールを選択するには、ガターをクリックします。

Procedure フォームにレイアウト領域を追加する

［XForms］ツールバーから、追加するレイアウトコントロールを選択します。
コントロールを追加する位置にカーソルを配置します。

カーソルが、ピンクの矢印になります。
クリックして、レイアウト領域を配置します。

レイアウト領域がフォームに追加されます。

Procedure レイアウト領域を削除する

レイアウト領域を選択します(選択すると、ガターのラベルがハイライト表示されます)。
右クリックして、［削除］を選択します。

Procedure レイアウト領域のサイズを変更する

サイズを変更するレイアウト領域を選択します。
レイアウト領域のハンドルを使用して、必要なサイズにまでドラッグします。

Procedure ネストされた繰り返しブロックを作成する

［XForms］ツールバーの［XFormsの繰り返しを挿入する］アイコンをクリックします。

視覚エディタ内の繰り返しブロックの空白部分をクリックします(ブロックの境界から離れた場所をクリックしてください。下側の境界上またはそのすぐ近くをクリックすると、既存のブロックの内部ではなく、直後に新たにブロックが追加されてしまいます)。

空の繰り返しグループがフォームに追加されます。次のように表示されます。

Procedure スイッチブロックを作成する

［XForms］ツールバーの［XFormsのスイッチを挿入する］アイコンをクリックします。
一番下のブロックの最下部にある空白部分に、ポインタを持っていきます。

［スイッチに新規ケースを追加］ダイアログボックスが表示されます。
ケースIDを、スペースで区切りながら2つ以上入力します。

ケースIDは、イベントエディタでの動作をプログラムするために使用します。
［OK］をクリックします。

入力した各ケースIDごとにケースブロックが作成された状態で、スイッチブロックが追加されます。
コントロールの追加と削除で説明されている方法で、ケースレイアウト領域にコントロールを追加します。

ヒント: ケースの追加と削除は、スイッチボックスを選択し、右クリックして表示されるポップアップメニューから、追加または削除のアクションを選択して行います。

フォームコントロールのプロパティの設定

プロパティは、特定のコントロールに対して設計時に設定できる属性です。プロパティ値は、プロパティインスペクタで指定します。 exteNd Directorの拡張機能(ページフローリンク領域)または便利機能(警告のリテラルテキストなど)に固有のプロパティについては、次の表を参照してください。その他すべての定義値については、XForms の仕様を参照してください。

プロパティ名	説明	適用対象
警告のリテラルテキスト	警告ボックスに表示されるテキストです。ユーザへの検証エラーの通知を参照してください。	モデル項目のプロパティを定義できるすべてのコントロール
ボタンの高さ	ランタイム時にページフローリンク領域に追加されるボタンの高さを指定します。デフォルトは25です。	ページフローリンク領域
ボタンのレイアウト	ランタイム時にページフローリンク領域に追加されるボタンのレイアウトを指定します。デフォルトは水平です。	ページフローリンク領域
ボタンの間隔	ランタイム時にページフローリンク領域に追加されるボタンの間隔を指定します。デフォルトは5ピクセルです。	ページフローリンク領域
ボタンの幅	ランタイム時にページフローリンク領域に追加されるボタンの幅を指定します。	ページフローリンク領域
ダイナミックな選択肢	Selectコントロールの作成を参照してください。	XFormsの複数選択
「class」スタイルルールの編集	次の処理ができるダイアログボックスを起動します。現在選択されているコントロールのCSSクラススタイルを変更スタイルを新規作成、または既存のスタイルを編集(CSSエディタを起動して)	CSSスタイル設定が適用されるすべてのコントロール
リンクのエミュレート	トリガコントロールの外観を定義します。オン―トリガがリンクとしてスタイル設定されます。 DOMActivateイベント(ボタンプレス)がないかリッスンする<xforms:action>イベントハンドラを追加します。アクション要素に、HTTP GET処理を介して新しいページをロードする<xforms:load>要素が盛り込まれます(こうして、要求タイプがGETに設定されます)。 GETに使用するデフォルトのURLはありません。ターゲットURLを介してユーザが追加する必要があります。オフ―トリガがボタンとしてスタイル設定されます。	XFormsトリガコントロール, リンクスタイルのXFormsトリガ, ページフローリンク領域
フィールドタイプ	インスタンス項目に対して、コントロールがバインドされていると想定するデータタイプを設定します。これは、フォーマットプロパティと組み合わせて使用してください。フィールドのデータタイプに有効なフィールドタイプを指定していることを確認してください。これら2つのタイプに競合が起きている場合は、次のような状況が発生します。フォームコントロールがバインドされているインスタンスノードは、無効になります。イベントxforms-invalidが、このノードにバインドされているフォームコントロールにディスパッチされます。フォームコントロールが無効になり、その結果、:invalid pseudoclassを持つCSSスタイルが適用されます。無効なインスタンスノードが、送信されるドキュメントフラグメントの一部の場合、送信に失敗します。書式も参照してください。	データにバインドできるすべてのコントロール
書式	データ表示の際の書式を指定します。有効な書式は、次のとおりです。数値、通貨、パーセント、###,###.##、#####0.##、#####.00 フィールドタイプも参照してください。	データにバインドできるすべてのコントロール
ヒントのリテラルテキスト	ツールチップに表示されるテキスト	表示されるすべてのコントロール
ID	コントロールの固有な識別子。	すべてのコントロール
ラベル	コントロールのラベルとして表示されるテキスト。	ラベルがあるすべてのコントロール
モデルID	フォームコントロールに関連付けられたモデルのID。	データをバインドできるすべてのコントロール
要求タイプ	Get・lt;xforms:load>アクションを使用します。ターゲットURLプロパティが必要です。 Post・lt;xforms:send>アクションを使用します。送信プロパティが必要です。	XFormsトリガコントロール、リンクスタイルのXFormsトリガ、ページフローリンク領域
ソース	挿入するXHTMLイメージがあるソースファイルの名前を指定します。	XHTMLイメージ
リンクスタイル	オン―XFormsトリガコントロールが、HTMLリンクとしてスタイル設定されます。 CSSクラスセレクタ(nv-link-style)をトリガのクラス属性に追加します。このCSSセレクタにより、トリガがHTML <a> tagのデフォルトの外観に見えるようにスタイル設定されます。このセレクタルールは、ページの<style>ノードに追加されるので、外観を自由に変更できます。リンクをエミュレートするようマーク付けされたトリガはすべて、この同じスタイルを共有します。オフ―トリガのクラス属性からセレクタ名を削除します。ただし、<style>ノードからセレクタルールを削除することはありません。	XFormsトリガコントロール、リンクスタイルのXFormsトリガ、ページフローリンク領域
送信	<xforms:send>の送信属性の値を指定します (これは、<xforms:model>の<xforms:submission>のIDです)。	XFormsトリガコントロール、リンクスタイルのXFormsトリガ、ページフローリンク領域
ターゲットURL	<xforms:load>のリソース属性の値を指定します (新しいページをロードするためにGETが送信される、宛先のURL)。このURLは、ポートレットコンテキストでURLを書き換えるために自動的にマークアップされます。そのため、ここで相対URLを指定すると、自分のポートレットに戻ります。	XFormsトリガコントロール、リンクスタイルのXFormsトリガ、ページフローリンク領域

データへのコントロールのバインド

フォームデザイナでは、コントロールを簡単に単一のノードまたはノードセットにバインドできます。ほとんどの場合、ユーザが何も操作しなくても、コントロールをデータにバインドできます。たとえば、次のとおりです。

データがバインドされたコントロールは、フォームウィザードにより自動的に作成されます。
データノードを、インスタンスデータペインから視覚エディタのコントロールにドラッグすると、フォームデザイナにより自動的にデータバインドが生成されます。

生成されたバインドを変更する場合、またはフォームに追加したコントロールをツールバーからバインドする場合は、プロパティインスペクタを使用して、バインド属性を指定できます。［モデル］タブで<bind>をセットアップし、次にバインドプロパティを<bind>要素のIDに設定することもできます。コントロールへの要素のバインドを参照してください。

注記: バインドは、コントロールの<ref>属性を介して次の手順で生成されます。 <ref>または<bind>のいずれかを指定できます。一方を指定すると、他方は自動的に削除されます。［ソース］タブから両方を入力した場合は、<bind>が優先されます。

Procedure XPathを介してコントロールを単一のノードにバインドする

視覚エディタで、バインドするコントロールを選択します。
プロパティインスペクタを使用して、モデルIDを指定します(フォームにモデル要素が複数ある場合)。
次の方法で、XPathを指定します。
- ［参照］のテキストボックスにXPathを入力(<ref>属性が生成されます)
  
  または
- XPathナビゲータを起動(［XPath］テキストボックス隣の省略記号をクリック)
  1. ［XPathナビゲータ］ダイアログボックスで、バインド対象ノードを見つけて選択します。
    
    XPathナビゲータの使用法の詳細については、『exteNd Directorアプリケーションの開発』のスコープパスおよびXPathに関する章を参照してください。
  2. ［OK］をクリックして、フォームデザイナに戻ります。

Procedure コントロールをノードセットに追加する

注記: <repeat>要素は、ノードセットにバインドする必要があります。

視覚エディタで、バインドするコントロールを選択します。
プロパティインスペクタを使用して、「モデルID」を指定します。
1. ［XPathナビゲータ］ダイアログボックスで、バインド対象ノードを見つけて選択します。
  
  XPathナビゲータの使用法の詳細については、『exteNd Directorアプリケーションの開発』のスコープパスおよびXPathに関する章を参照してください。
2. ［OK］をクリックして、フォームデザイナに戻ります。
注記: <ref>が複数のノードになる場合は、最初のノードが使用されます。

Selectコントロールの作成

Selectコントロールに値のリストを提供する方法は、2通りあります。

方法	可能な処理	使用する場合
スタティック	フォーム設計時にリスト値を指定します。	リストが比較的短い場合、値が既知の場合、または値が一定の場合に使用します。
ダイナミック	Nodesetからリスト値を取得するよう指定します。	情報がXMLファイルにある場合に使用します。リスト項目がどうなるか不明の場合、またはリストが頻繁に変わる場合にも使用します。

方法

可能な処理

使用する場合

スタティック

フォーム設計時にリスト値を指定します。

リストが比較的短い場合、値が既知の場合、または値が一定の場合に使用します。

ダイナミック

Nodesetからリスト値を取得するよう指定します。

情報がXMLファイルにある場合に使用します。

リスト項目がどうなるか不明の場合、またはリストが頻繁に変わる場合にも使用します。

リスト値リストには、次の2タイプの値があります。

ラベル(表示用)
値(格納用)

ユーザに表示されるのはラベルの方ですが、関連付けられた値は、インスタンスノードに書き込まれた値です。そのため、ユーザが認識できるテキストを表示できる一方で、キーまたは他のタイプのコードをインスタンスノードに格納できます。たとえば、「apples」、「oranges」、および「pears」という語を入力した場合、これらの語は表示リストに表示されます。ところが、「apples」を選択して返される値は、「apples」ではなく「1」になります。「oranges」なら「2」です。

インスタンス要素 Selectコントロールは通常、2つのインスタンス要素に関連付けられます。

一方は、表示値を持つ要素
他方は、値が書き込まれる要素を持つ要素

Procedure リストをスタティックにロードする

Selectコントロールを選択して、プロパティシートにアクセスします。
［選択肢の編集］リンクを選択します。

［Selectコントロールの選択肢］ダイアログボックスが表示されます。
［スタティックな選択肢］ラジオボタンをクリックします。
このダイアログボックスにより、［ラベル］と［値］のテキストボックスで次の処理ができます。
- 事前定義されたラベルと値の選択肢を変更するには、テキストボックス内でダブルクリックして、新しいテキストを入力します。
- 新たに選択肢を追加するには、［追加］をクリックして、追加されたテキストボックス内にカーソルを置き、ラベルと値を入力します。
入力を終えたら、［OK］をクリックします。

Procedure リストをダイナミックにロードする

Selectコントロールを選択して、プロパティシートにアクセスします。
［選択肢の編集］リンクを選択します。

［Selectコントロールの選択肢］ダイアログボックスが表示されます。
［ダイナミックな選択肢］ラジオボタンをクリックします。
ドロップダウンリストボックスからモデルを選択します。
Nodeset XPathの隣にある省略記号をクリックして、XPathナビゲータにアクセスし、Nodesetを選択します。
ラベルのXPathの隣にある省略記号をクリックして、XPathナビゲータにアクセスし、値を表示します。
値のXPathの隣にある省略記号をクリックして、XPathナビゲータにアクセスし、格納値を選択します。この値は、インスタンスノードに書き込まれます。
入力を終えたら、［OK］をクリックします。

モデル要素の操作

XFormsのモデル要素により、フォームで利用できるXMLデータの構造が定義されます。定義されるのは、次の項目です。

ユーザに対して表示されたり、ユーザが入力したりするデータの構造
送信するデータの構造
フォームコントロールを初期化するデータ(インスタンスデータ)
ユーザデータを検証するルール

［モデル］タブには、次の要素があります。

要素	説明	参照
モデル	モデルルート	モデル要素の指定
インスタンス	フォームの初期化に使用されるデータをポイントするか、または含みます。	instance要素の指定
action	フォームのどこからでもアクセスできるイベントハンドラとアクションを定義します。	アクションの指定
送信	送信データのセット、および送信方法を定義します。	送信要素の指定
バインド	インスタンスデータのプロパティ(モデル項目プロパティ)を定義します。「読み込み専用」、「関連」、「計算」、および「間接的バインド」などです。	バインド要素の指定

［モデル］タブについて

［モデル］タブでは、フォームのモデルを構成する要素をグラフィカルに定義できます。［モデル］タブは次のように表示されます。

frmModelPane

［モデル］タブには、次の機能があります。

ツール	説明
モデルエディタ	モデル要素の要素を追加したり、削除したりするために使用します。ノードを選択したら、利用できるオプションを見るために右クリックしてください。
インスタンスデータペイン	インスタンスデータの構造を変更するには、インスタンスデータペインを使用します。このツールの使用方法の詳細については、オンラインの『ユーティリティツール』にある「XMLエディタ」を参照してください。
プロパティインスペクタ	選択したモデル要素の属性の作成、変更に使用します。
イベントエディタ	選択したモデル要素のイベントとアクションの定義に使用します。

モデル要素の指定

デフォルトでは、ウィザードにより生成されたフォームにはモデルが1つあります。

Procedure モデル要素を追加する

［モデル］タブでフォームを開いた状態で、［追加］をクリックします(モデルエディタの最上部にあります)。

次のダイアログボックスが表示されます。 wsrp_rewrite_がモデルID名に追加されています。これは、推奨されているプレースホルダです。 wsrp_rewrite_は、ランタイム時に固有なIDに置換され、同じページ上の他のフォームまたはポートレットと名前が競合するのを回避できます。
モデルに名前を付けて、［OK］をクリックします。

新しい空のモデルツリーが作成され、モデルエディタに表示されます。

Procedure モデル要素を削除する

［モデル］タブでフォームを開いた状態で、削除するモデル要素をドロップダウンリストボックスから選択します。
［削除］をクリックします。

Procedure モデルプロパティの指定

モデルエディタでモデルを選択します。

プロパティインスペクタにアクセスし、次のように入力してプロパティを完成させます。

プロパティ	説明
ID	モデルの固有な識別子を指定します。モデルIDは、モデルが1つの場合は必須ではありませんが、フォームウィザードにより常に生成されます。ウィザードではトークンのwsrp_rewriteを使用します。ランタイム時に、単一のページ上に複数のXFormsを持つ複数のポートレットが存在する可能性があるので、IDの使用をお勧めします。
スキーマURI	インスタンスデータの構造を記述し、有効化するのに必要な、外部スキーマドキュメントのリストを指定します。スキーマドキュメントを追加する［スキーマリストの編集］をクリックします (［スキーマファイルリストを編集する］ダイアログボックスが表示されます)。［追加］をクリックします。［スキーマファイルを選択する］ダイアログボックスで、スキーマファイルの名前と場所を指定します。［OK］をクリックします。［OK］をクリックします。

プロパティ

説明

モデルの固有な識別子を指定します。

モデルIDは、モデルが1つの場合は必須ではありませんが、フォームウィザードにより常に生成されます。ウィザードではトークンのwsrp_rewriteを使用します。ランタイム時に、単一のページ上に複数のXFormsを持つ複数のポートレットが存在する可能性があるので、IDの使用をお勧めします。

スキーマURI

インスタンスデータの構造を記述し、有効化するのに必要な、外部スキーマドキュメントのリストを指定します。

スキーマドキュメントを追加する

［スキーマリストの編集］をクリックします (［スキーマファイルリストを編集する］ダイアログボックスが表示されます)。
［追加］をクリックします。
［スキーマファイルを選択する］ダイアログボックスで、スキーマファイルの名前と場所を指定します。
1. ［OK］をクリックします。
［OK］をクリックします。

For more information イベントの追加の詳細については、イベントハンドラのカスタマイズを参照してください。

注記: 要素タイプの中には、インスタンスのように、要素のルートへの追加しか認めないものもあります。バインドなどの他の要素タイプでは、要素を他の要素内にネストすることを認めています。ネストできる要素を見極めるには、要素(ルートではない)を選択して右クリックし、メニュー項目に［アイテムの追加］があるかどうかを調べます。

instance要素の指定

Procedure インスタンスデータのプロパティを設定する

インスタンス要素(ルートではない)を選択します。

インスタンス要素のプロパティが、プロパティインスペクタに表示されます。プロパティには、次のものがあります。

プロパティ	説明
ID	インスタンスデータの固有な識別子。これが必要になるのは、単一のドキュメントに複数のインスタンスデータノードがある場合だけです。ランタイム時に、単一のページ上に複数のXFormsを持つ複数のポートレットが存在する可能性があるので、フォームデザイナで常に_wsrp_rewrite_を追加できるようにすることをお勧めします。
ランタイム時に使用するページフローデータ	ランタイム時のインスタンスデータの処理方法を指定します(フォームがページフロー内に取り込まれた後)。次のオプションがあります。常時(デフォルト) - ランタイム時に常にデータを置換します。置換するデータがない場合は、実行エラーが発生します。使用可能な場合 - ランタイム時に新しいデータが存在する場合にだけ置換します。存在しない場合は、設計時のデータを使用します。使用可能でない場合削除 - ランタイム時に新しいデータがある場合はそれを使用します。削除されてしまうため、設計時のデータを使用しないように注意してください。使用しない - 設計時データだけを使用します。重要: フォームをページフローに取り込む(Xforms活動として)と、スコープパスのセットを指定できるようになります(この活動にプロパティインスペクタを使用します)。その際、置換できる<xforms:instance>ノードのそれぞれに対して、換わりのデータが提示されます (これらは、「ランタイム時に使用するページフローデータ」が［常時］、［使用可能な場合］、または［使用可能でない場合削除］に設定されているインスタンスノードです。 )
プライマリインスタンスデータですか?	<xforms:instance>ノード用のデータを、「プライマリインスタンスデータ」として処理するかどうかを指定します。プライマリインスタンスデータとは、ページ表示のXSLT変換に対する入力データのことです。ページのXSLT式で使用するデフォルトのコンテキストになります。その他の入力データはすべて「セカンダリ入力データ」であり、XSLT式の変数参照を介さないとアクセスできません。詳細については、インスタンスデータのランタイム時置換についてを参照してください。
インライン	データがフォームのモデル要素内に含まれている場合は、このチェックボックスをオンにします。オンにすると、ウィザードにより生成されたインスタンスデータを使用したり、インスタンスデータをプロジェクトのリソースセット内にあるファイルからインポートできます。詳しくは、後で述べるファイルからのインスタンスデータのインポートを参照してください。データを外部ファイルから参照する場合は、チェックボックスをオフにします。詳しくは、後で述べるソース(URI)を参照してください。
ファイルからのインスタンスデータのインポート	インスタンスデータをインポートする省略記号ボタンをクリックします。［インスタンスノードにファイルをインポートする］ダイアログボックスで、インポートするファイルの名前を入力します。または［インポート］をクリックして、インポートするファイルに移動し、［開く］をクリックします。［OK］をクリックします。
ソース(URI)	データがインラインではない場合、URIでデータの場所を指定できます。注記: URIは、現在のプロジェクトのリソースセット内における場所を参照する必要があります。リンクをインスタンスデータに追加する［ソース(URI)］テキストボックス隣にある省略記号ボタンをクリックします。［ファイルの選択］ダイアログボックスで、ファイルを選択して［OK］をクリックします。

インスタンスデータのランタイム時置換について

フォームのデータはランタイム時に、［ランタイム時に使用するページフローデータ］プロパティで指定された方法で置換されます。データはフォーム(ポートレットとして稼動します)ごとに別々に置換されます。置換処理は、ポータルページへの集約前に行われます。さらに、入力ドキュメントに対応するデータが、次のルールに従って利用できるようになることがあります。

ルール	説明
プライマリインスタンスデータとして指定される、置換できる<xforms:instance>要素はありません。	インスタンス要素が1つしかない場合、この1つがプライマリインスタンスデータとして処理されます。プライマリ入力ドキュメントが、プライマリインスタンスデータにマッピングされます。
ページに複数のデフォルトの<xforms:instance>要素がある場合、1つのインスタンス要素をプライマリインスタンスデータとして定義する必要があります。さらに、その他の置換できる<xforms:instance>要素はすべて、セカンダリ入力データを使用します。セカンダリ入力データはすべて、XSLT変数を介して、ページのXSLT式で利用できるようになります。 XSLTで許可されている入力ドキュメントは、1つだけです。そのため、他のドキュメントはXSLT変数という仕組みを介してアクセスできるようにする必要があります。変数識別子は、対応する<xforms:instance>要素のIDに等しくなります (XPath式の変数にアクセスするには、XSLTでドル記号を使用します。<xforms:instance id="foo">とした場合は、そのランタイムデータには、<xsl:value-of select="$foo/a/b/c"/>などを介してアクセスします)。

ルール

説明

プライマリインスタンスデータとして指定される、置換できる<xforms:instance>要素はありません。

インスタンス要素が1つしかない場合、この1つがプライマリインスタンスデータとして処理されます。プライマリ入力ドキュメントが、プライマリインスタンスデータにマッピングされます。

ページに複数のデフォルトの<xforms:instance>要素がある場合、1つのインスタンス要素をプライマリインスタンスデータとして定義する必要があります。さらに、
- その他の置換できる<xforms:instance>要素はすべて、セカンダリ入力データを使用します。
- セカンダリ入力データはすべて、XSLT変数を介して、ページのXSLT式で利用できるようになります。 XSLTで許可されている入力ドキュメントは、1つだけです。そのため、他のドキュメントはXSLT変数という仕組みを介してアクセスできるようにする必要があります。
- 変数識別子は、対応する<xforms:instance>要素のIDに等しくなります (XPath式の変数にアクセスするには、XSLTでドル記号を使用します。<xforms:instance id="foo">とした場合は、そのランタイムデータには、<xsl:value-of select="$foo/a/b/c"/>などを介してアクセスします)。

For more information インスタンス要素へのイベントの追加の詳細については、イベントおよびアクションの操作を参照してください。

アクションの指定

フォームデザイナには、フォーム内でのアクションを定義する方法が複数あります。

方法	説明
［モデル］タブのアクションノード	アクション(固有のID付き)作成の場所として［モデル］タブのアクションノードを使用します。その後、フォームの任意の場所からアクションを参照します。
［フォーム］タブのイベントエディタ	［フォーム］タブから起動できるイベントエディタを使用して、フォームコントロールのアクションを作成します。詳細については、イベントおよびアクションの操作を参照してください。

方法

説明

［モデル］タブのアクションノード

アクション(固有のID付き)作成の場所として［モデル］タブのアクションノードを使用します。その後、フォームの任意の場所からアクションを参照します。

［フォーム］タブのイベントエディタ

［フォーム］タブから起動できるイベントエディタを使用して、フォームコントロールのアクションを作成します。

For more information 詳細については、イベントおよびアクションの操作を参照してください。

この節の後半では、［モデル］タブでアクションを指定する方法を説明していきます。

Procedure アクション/イベントハンドラを作成する

［モデル］タブで、モデルツリーから一番上にある「アクション」ノードを選択します。
右クリックして、［アイテムの追加］を選択します。

プロパティインスペクタに移動して、次のプロパティを指定します。

プロパティ	指定する内容
ID	アクション/イベントハンドラの固有な名前を入力します。
イベント名	ドロップダウンリストからイベントを選択します。
オブザーバ	(オプション)要素を1つ、オブザーバとして選択します。
ターゲット	(オプション)要素を1つ、アクションのターゲットとして選択します。

右クリックして、イベントに対して実行するアクションを選択します。
プロパティインスペクタに移動して、選択したアクションの仕様を定義します。

送信要素の指定

送信要素により、次の項目が定義されます。

送信するデータの構造
送信時期
送信方法

Procedure 送信要素を作成する

［モデル］タブで、モデルツリーから一番上にある「送信」ノードを選択します。
右クリックして、［アイテムの追加］を選択します。

プロパティインスペクタに移動して、次のプロパティを指定します。

プロパティ	説明
ID	送信要素の固有なIDを指定します。
バインドID	バインド要素のIDを指定します。送信対象ノードを指定するバインド要素のIDを選択します。
参照のXPath	送信対象ノードを指定するXPathです。
アクション(URI)	送信要求の宛先のURIを指定します。
メソッド	送信方法を指定します。値: Post Get Put form-data-post multipart-post (Postと同様の扱い) urlencoded-post
置換	送信後に返されたドキュメントに対するプロセッサの動作を指定します。値: すべて(デフォルト) インスタンスなし
区切り記号	URLがエンコードされたシリアル文字で使用する区切り文字を指定します。値: ; &
インデント	アプリケーション/XMLのシリアル化の場合のみ。スペ－スを挿入するかどうかを指定します。値: True False
スタンドアロン	アプリケーション/XMLのシリアル化の場合のみ。宣言を含めるかどうかを指定します。値: True False
XML宣言の排除	アプリケーション/XMLのシリアル化の場合のみ。 XML宣言を含めるかどうかを指定します。値: True False
エンコード	アプリケーション/XMLのシリアル化の場合のみ。使用するエンコードのタイプを指定します。
ネームスペースリストの編集	アプリケーション/XMLの一連番号の場合のみ。シリアル化されたXMLに含めるネームスペースを指定します。どのネームスペースも指定しないと、すべて指定したと見なされます。ネームスペースリストを編集する［edit namespace list］をクリックします含めるネームスペースを選択します。連続するグループを選択するには<Shift>キーを使用し、連続していない、複数の項目を選択するには<Ctrl>+<Shift>キーを使用します。［OK］をクリックします。
メディアタイプ	シリアル化されたインスタンスデータのインターネットメディアタイプを指定します。
バージョン	アプリケーション/XMLのシリアル化の場合のみ。
CDATAセクション要素	アプリケーション/XMLのシリアル化の場合のみ。 CDATA要素を追加する［CDATA要素リストの編集］をクリックします［CDATA項目リストを編集する］ダイアログボックスで、［追加］をクリックします。［リスト項目を追加する］ダイアログボックスで名前を入力します。［OK］をクリックします。［OK］をクリックします。

For more information 送信要素へのイベントの追加の詳細については、イベントおよびアクションの操作を参照してください。

バインド要素の指定

インスタンスデータのルールを設定するには、バインド要素を使用します。たとえば、ユーザの選択に応じてフィールドを「必須」、「有効」、または「無効」に指定できます。また、コントロールのバインドを指定するための間接的な方法として、バインド要素を使用することもできます。<ref>または<nodeset>ではなく、コントロールにbind=bindingID属性を使用します。［モデル］タブでバインド要素を定義したら、UIバインド式を作成するため［フォーム］タブに戻り、それらのバインド要素をフォームコントロールに関連付けます。

Procedure バインド要素を作成する

［バインド］を選択します。
右クリックして、［項目の追加］を選択します。

Procedure バインド要素を削除する

バインド要素を選択します。
右クリックして、［項目の削除］を選択します。

Procedure バインド要素にプロパティを設定する

バインド要素を選択します。

プロパティインスペクタにアクセスし、次のように入力してプロパティを完成させます。

プロパティ	説明
ID	バインド要素の固有なIDです。
NodesetのXPath	バインド中のノード。
モデル項目のプロパティ	前に述べたNodesetのXPathで定義されたノードに適用するための、モデル項目のプロパティを定義できます。詳細については、モデル項目プロパティの指定を参照してください。
タイプ	関連付けられたノードのXMLスキーマデータタイプを指定します。フォームデザイナには、一部のデータタイプのフォーマットを指定できる便利な機能が搭載されています。このフォーマットをサポートしているのは、太字で表記されているデータタイプだけです。［フォーム］タブで設定したフォーマットを、このようなノードにバインドされたコントロールのプロパティインスペクタに適用します。詳細については、書式を参照してください。

モデル項目プロパティの指定

次のようなモデル項目のプロパティを指定できます。

モデル項目プロパティ	説明
読み込み専用	ユーザはデータの変更が許可されていません。読み込み専用ノードにバインドされたフォームコントロールは、どれも無効です。ノードを「読み込み専用」にする「読み込み専用」のモデル項目プロパティを選択します。ブール値に評価するXPath式を作成するか、または値をTrue()に変更します。
必須	ユーザが値を入力する必要があります。「必須」ノードにバインドされたフォームコントロールは、値が入力されないと、送信エラーを生成します。ノードを「必須」にする「必須」のモデル項目プロパティを選択します。ブール値に評価するXPath式を作成するか、または値をTrue()に変更します。
関連	ノードが現在関連しているかどうかを指定します。「関連しない」ノードにバインドされたフォームコントロールは、無効になるか表示されません。「関連しない」ノードは「必須」に変更できます。その場合、「必須」プロパティは無視されます。ノードを「関連しない」にする「関連」のモデル項目プロパティを選択します。ブール値に評価するXPath式を作成するか、または値をFalse()に変更します。
計算	ノードの値を定義する計算を指定します。ノードに「計算」を作成する「計算」のモデル項目プロパティを選択します。 XPathナビゲータで、計算を作成します。詳細については、『exteNd Directorアプリケーションの開発』のスコープパスおよびXPathsに関する章を参照してください。
制限	Falseの場合、関連付けられたモデル項目が有効と見なされるブール式を指定します (逆は必ずしもTrueにはなりません)。

ユーザへの検証エラーの通知

フォームデザイナでは、コントロール(またはフォーム)が、モデル項目プロパティの検証テストに不合格になったことをユーザに簡単に通知できます。

Procedure ユーザにエラーを通知する

モデル項目プロパティの定義を終えたら、［フォーム］タブにアクセスします。
モデル項目プロパティの定義対象であるノードにバインドされたコントロールを選択します。
コントロールのプロパティインスペクタで、［ヒント］タブにアクセスします。
ドロップダウンリストから、モデル項目プロパティの定義に関連付けられたバインドを選択します。
不合格になった場合にユーザに表示するメッセージを、［警告のリテラルテキスト］に入力します。

コントロールへの要素のバインド

いったん［モデル］タブでバインド要素を定義したら、UIバインド式を作成するため［フォーム］タブに戻り、それらのバインド要素をフォームコントロールに関連付けます。

イベントおよびアクションの操作

XFormsでは、XMLイベントモデルをベースにしている、DOM Level 2イベントモデルをサポート、拡張しています。

イベントエディタを使用すると、簡単にイベントハンドラを作成して、XFormsアクションを定義できます。

イベントエディタについて

イベントエディタは、［フォーム］タブと［モデル］タブの両方で使用できます。次のように表示されます。

frmEventEditor

イベントエディタは、イベントハンドラを許可している項目を選択すると有効になります。

イベントエディタでは、XFormsのイベントとアクションをサポートしていますが、イベントハンドラ作成時に、必ずしもすべてのイベントが選択肢として提示されるわけではありません。任意のイベントを、選択肢のボックスか、または［ソース］タブから入力できます。

Procedure イベントエディタにアクセスする

をクリックします。
イベントを定義するフォームコントロールまたはモデル項目を選択します。

［イベント］ドロップダウンリストには、その要素でのイベント用の既存ハンドラが表示されています。

Procedure イベントハンドラを作成する

イベントハンドラを定義する要素を選択します。
新たにイベントハンドラを作成するため、をクリックします。

［要素のイベントハンドラを作成する］ダイアログボックスが表示されます。
［イベントタイプ］ドロップダウンリストからイベントを選択するか、または一覧に名前がない場合は、イベント名を入力します。
1. オブザーバなどのためにイベントハンドラおよびデフォルトのアクションをさらにカスタマイズするには、［カスタムオプション］をクリックします。その後の操作については、イベントディスパッチングをカスタマイズするを参照してください。
［OK］をクリックします。

これで、イベントエディタでXFormsアクションがイベントハンドラに応答するように指定できます(次に説明します)。

注記: イベントハンドラをインスタンス要素に設定することはできません。インスタンスノードが、単一のチャイルド要素に限定されているからです。イベントエディタを使用してイベントハンドラをインスタンス要素に追加しようとすると、自動的にモデルに追加されます。

Procedure イベントハンドラにXFormsアクションを指定する

イベントハンドラを作成したら、をクリックします(［XFormsアクション］領域にあります)。
ポップアップリストから応答するXFormsアクションを選択します。

選択されたアクションは、プロパティと共に［XFormsアクション］リストに表示されます。
フォームを保存します。

イベントエディタはコードを生成して、コントロールが間違いなくイベントに応答するようにします。

For more information アクションのプロパティの詳細については、XFormsの仕様を参照してください。

Procedure アクションを削除する

［アクション］リストからアクションを選択します。
をクリックします。

Procedure イベントハンドラを削除する

［イベントハンドラ］リストからイベントハンドラを選択します。
をクリックします。

イベントハンドラのカスタマイズ

Procedure イベントディスパッチングをカスタマイズする

次のいずれかの方法で、［カスタムオプション］ダイアログボックスにアクセスします。
- ディスパッチするイベントを最初に選択する場合は、［カスタムオプション］をクリックします。
  
  または
- イベントエディタから［オプション］をクリックします。

次のとおりにダイアログボックスに入力します。

オプション	説明
オブザーバ要素のイベント処理	リストボックスからオブザーバ要素を選択します。このオプションにより、イベントハンドラが、選択されたXML要素に移動します。注記: イベントオブザーバを本文タグに配置しないでください。これと同じ結果を得るには、［モデルにイベントハンドラを添付する］をクリックして、モデルを選択し、本文要素をオブザーバとして指定します。
フェーズ時のイベント処理	イベントハンドラの実行順序を制御できます。
ハンドラを選択した要素のイベントに制限する	これは、イベントハンドラが、選択されたコントロールの先祖に添付されている場合にだけ有効です。これにより、ハンドラがその選択されたコントロールに対して固有になります。このオプションを使用して、指定コントロールに対するイベント処理手順の特定の時点に、何かを発生させることができます。
この要素のハンドラ以降にイベントの伝達を続行しますか	先祖ノードとフェーズオプションでのハンドラと連携させて使用すると、特定のイベントに対してどのイベントハンドラが実行されるのかを制御できます。
［デフォルトのアクションを実行またはキャンセルしますか］ボタン	XFormsプロセッサのデフォルトの動作を無効にできます。［キャンセル］を選択すると、デフォルトの動作が常にキャンセルされます。条件処理はできません (必ずしもすべてのXFormsイベントで、デフォルトの動作がキャンセルできるわけではありません)。

［OK］をクリックします。

フォームのテスト

フォームのデータ処理ロジックおよびその見た目と使い心地をテストできるように、フォームデザイナには、次の各タスク用に組み込みツールが搭載されています。

使用するツール	テスト内容
XFormsプレビュー	イベントとデータの処理 XHMTLコンポーネントの見た目と使い心地
ブラウザでの表示形式	ページでのすべてのコンポーネントの見た目と使い心地

使用するツール

テスト内容

XFormsプレビュー

イベントとデータの処理

XHMTLコンポーネントの見た目と使い心地

ブラウザでの表示形式

ページでのすべてのコンポーネントの見た目と使い心地

XFormsプレビューの使用

XFormsプレビューでは、Swingレンダラを使用して、ページにXFormsコントロールを表示しています。この機能は、送信済みデータの構造をテストするのに特に便利です。

Procedure XFormsプレビューを使用する

フォームを開きます。
［XFormsプレビュー］タブを選択します。

フォームが表示され、通信に利用できます。
- 知らない間に無効になっていた(ノードで「無効」とマーク付けしていなかった)コントロールでは、データバインドのトラブルが発生していることがあります。
- 送信ノードは、XFormsプレビューの左側ペインに表示されます。

XFormsプレビューの制限事項 XFormsプレビューでは、XHTMLページに関連付けられたHTMLは表示しません。

ブラウザでの表示形式の使用

ブラウザでの表示形式によりXHTMLレンダラが使用され、単一ページ上のXHTMLとHTML両方が表示されます。この機能は、レイアウト問題を解決するのに特に便利です。

ブラウザでの表示形式を使用するには、フォームのプロジェクトをアプリケーションサーバに展開する必要があります。いったんプロジェクトが展開されると、フォームに加えた変更は、直ちに利用できるようになります。プロジェクトを再展開する必要はありません。

Procedure ブラウザでの表示形式を使用する

プロジェクトを開きます。
表示するフォームを開きます。
［XFormsプレビュー］を選択します。
［ブラウザでの表示形式］ボタンを選択します。

［プロセッササーブレットの場所の指定］ダイアログボックスが表示されます。

次の値を入力して、ダイアログボックスを完成します。

フィールド	指定する内容
プロセッササーブレットの場所の指定	フォームのプロジェクトが展開されているサーバの名前を指定します。
デフォルトのブラウザの使用	現在のコンピュータで使用しているデフォルトのブラウザの場所を、フォームデザイナに見つけさせる場合は、このラジオボタンをオンにします。
User browser	デフォルト以外のブラウザを指定するには、このラジオボタンをオンにして、テキストフィールドに入力します。

［OK］をクリックします。

フォームがブラウザに表示されます。「ページが見つかりません」という内容のエラーが発生したら、フォームのプロジェクトが指定サーバに展開されていることを確認してください。

For more information 展開の詳細については、『exteNd Directorアプリケーションの開発』の展開に関する章を参照してください。

ポータルテーマのテスト

さまざまなポータルテーマを使用しているフォームがどのように見えるのかをテストすることをお勧めします。

Procedure ポータルテーマを使用しているフォームがどのように見えるのかをテストする

［フォーム］タブでフォームを開きます。
［フォームデザイナ］>［ポータルCSSテーマを設定］の順に選択します。

［ポータルテーマを適用する］ダイアログボックスが表示されます。

次のとおりにパネルに入力します。

フィールド	指定する内容
ポータルテーマを使用しますか?	テーマを適用する場合は、［はい］を選択します。
このページのポータルテーマを選択してください	適用するポータルテーマを選択します。

［OK］をクリックします。

このスタイル設定は、設計時にのみ適用されます。テーマファイルへのリンクは、ファイルが保存されると削除され、ファイルが再度開かれると復元されます(フォームデザイナ内で)。リンクを完全に削除するには、ダイアログボックスを再度開いて、［いいえ］を選択します。

XFormsプレビューおよびブラウザでの表示形式では、ポータルテーマを使用しません。

ブラウザのフォントサイズのテスト

フォームをさまざまなフォントサイズでテストすることをお勧めします。

Procedure 設計時にブラウザのフォントサイズをテストする

［フォーム］タブでフォームを開きます。
［フォームデザイナ］>［ブラウザフォントの上書きを設定］の順に選択します。

［上書きフォントを設定する］ダイアログボックスが表示されます。

次のとおりにダイアログボックスに入力します。

フィールド	指定する内容
フォントを上書きしますか?	設計環境でのブラウザのフォントサイズを上書きする場合は、［はい］を選択します。
このページの上書きフォントと単位を選択してください	使用するフォントサイズと単位を指定します。

［OK］を選択します。

指定したフォントが、<body>タグでフォントサイズスタイルとして適用されます。

フォームのXML構造の検証

フォームを検証して、フォームのXMLが正しく構成されており、解決できる宣言済みネームスペースのスキーマに準拠していることを確認できます。

Procedure フォームを検証する

［フォームデザイナ］>［検証］の順に選択します。