ウィザードの生成

WorkWithPlus では、きわめて簡単にウィザード Web パネルを生成できます。ウィザードの各ステップでエンドユーザーが入力したすべての情報が最後のステップで保存されるように、各ステップの状態を自動的に管理します。

これを実現するために、WorkWithPlus には「ウィザードテンプレート」という名前のテンプレートタイプが用意されています。このテンプレートを表示して管理するには、[WWP Configuration] -> [WebPanel テンプレート] を選択します。

既定では、次の 2 種類のウィザードテンプレートがあります: Wizard Bullet Type と Wizard Arrow Type。このテンプレートに変更を加えることも可能です。また、新しいテンプレートを作成することもできます。次の図に、この 2 つのテンプレートが示されています。

各ウィザードテンプレートにはメイン部分があります。これはテンプレートの最初のタブです。メイン部分には次のものが含まれています:

  • ウィザードのタイトル。ウィザード Web パネルの作成時に変更する必要があります。
  • [Step Titles] という名前のノード。ウィザードのさまざまなステップを表示する Web コンポーネントです。
  • [Steps position] という名前のノード。ステップの内容をフォーム内のどこに表示するかを定義します。

上の例では、現在のステップの説明を表示するテキストブロック [ステップの説明] も含まれています (イベントブロックに追加されるコードで設定されているため)。

また、各ウィザードテンプレートには、ウィザードステップの作成時に開発者が選択する一連の「ステップテンプレート」も含まれています。ウィザードテンプレート内には新しい「ステップテンプレート」を作成できます。また、新しい「ステップテンプレート」を追加することも可能です。

各「ステップテンプレート」には、その内容と [StandardAction (WizardPrevious)] および [StandardAction (WizardNext)] が含まれます。これらのアクションは、Web パネル内のステップの位置に応じて自動的に非表示になったり (たとえば、最初のステップの場合、前に戻るオプションはありません)、動作を変えたりします (これらの StandardActions の詳細については、次のリンクを参照してください)。

両方の「ウィザードテンプレート」の既定で提供されるステップは次のとおりです: [Welcome]、[Data]、[Select Grid Items]、[Add Grid Items]、[Completed]。

ステップテンプレート: [Wizard Bullet Type] -> [Welcome]

このステップテンプレートの目的は、ウィザードの紹介を行うことです。ウィザード Web パネルでこのステップテンプレートを使用するときは、ウィザードの目的の説明を入力してテキストブロックを変更する必要があります。

ステップテンプレート: [Wizard Bullet Type] -> [Data]

このステップテンプレートは、情報を表示したり、ユーザーに情報の入力を求めたりするのに使用できます (ここでは、ビジネスコンポーネントに基づいた変数を追加してエレメントを選択したり、ドメインや項目属性などに基づいた変数を追加したりすることができます)。

 

ステップテンプレート: [Wizard Bullet Type] -> [Select Grid Items]

このステップテンプレートは、グリッドにアイテムを表示し、エンドユーザーがグリッド内のそのアイテムを選択するようにする必要がある場合に使用できます。

ステップテンプレート: [Wizard Bullet Type] -> [Add Grid Items]  

このステップテンプレートは、エンドユーザーが 1 つのステップでアイテムのコレクションを 1 つずつ追加し、まとめて表示する必要がある場合に使用できます。たとえば、新しい Person を作成するときに、電話番号や E メールアドレスを 1 つずつ追加します。設定方法が分かるように、このステップテンプレートにはサンプルコードが含まれています。

 

このステップテンプレートを使用する場合は、SDT コレクションに基づいたグリッドにすることをお勧めします。それには、[Grid] を右クリックして [SDT を選択…] を選択します。また、挿入ボタンと削除ボタンにコードを追加する必要があります。イベント ブロック コードとして組み込まれる、このそれぞれについて例があります。

ステップテンプレート: [Wizard Bullet Type] -> [Completed]

このステップテンプレートは、ウィザードの最後のステップとして使用し、プロセスや関連アクションなどに関する情報を含めることができます。

ウィザード Web パネルの作成方法 

新しい Web パネルを作成して保存する必要があります。オブジェクトのパターン部分を選択し、[WorkWithPlus パターンインスタンスを作成…] リンクをクリックして、ウィザードテンプレートを選択します。

「ウィザードテンプレート」を選択したら、「ウィザードタイトル」テキストブロックに Web パネルの目的を入力してカスタマイズします。必要な数のウィザードステップを作成する必要があります。これらのステップは「ステップテンプレート」に基づいて作成することができます:

選択できる「ステップテンプレート」は、前の手順で選択した「ウィザードテンプレート」に存在するステップテンプレートです (この例では Wizard Arrow Type ウィザードテンプレートが選択されています)。そのウィザードで必要となるステップを必要な数だけ追加します。

ステップには、条件付きステップを定義できる [condition] という名前のプロパティがあります。つまり、ウィザードでそのステップを実行するかどうかは、条件を満たしているかどうかによって決まります。前のステップで [次へ] が押されたときに条件を満たしていない場合は、1 つ先のステップに移動します (たとえば、ステップ 2 が条件付きであるとします。ステップ 1 にいるときに [次へ] を押した場合、ステップ 2 に進むかステップ 3 に進むかは、条件を満たしているかどうかによって決まります)。

次の例では、ウィザードに 4 つのステップがあり、それぞれ異なるステップテンプレートに基づいています。ただし、同じステップテンプレートに基づいたステップを複数含めることもできます。

各ステップは Web コンポーネントとして GeneXus に保存されます。[次へ] または [前へ] が選択されると、WorkWithPlus が自動的に Web パネルで動作を作成し、対応するステップを呼び出します。Web パネルインスタンスの最初のタブにある「Steps」セクションのステップは並べ替えることができます。

WorkWithPlus のほかのオブジェクトと同様に、各ステップにはユーザーコードを追加できます。たとえば、データ検証が必要な場合は、[次へ] ボタンイベントにデータ検証を追加できます:

また、変数の [Is Required] プロパティを使用することもできます。これにより、WorkWithPlus が自動的に [次へ] ボタンに検証を追加します。

WorkWithPlus は、各ステップのすべての入力値を使用して SDT を作成し、その SDT 情報を各 [次へ] ボタンにロードします。また、エンドユーザーが [前へ] を選択すると、WorkWithPlus は、エンドユーザーが前のステップで入力した情報をロードします。

ステップで補足情報を保存する必要がある場合は、SDT WizardAuxiliarData に基づいた AuxiliarData という名前のエレメントを SDT 内に作成します:

この SDT にはキーと値を持つアイテムのコレクションが含まれます。また、補足データアイテムの保存、取得、削除を行う WizardAuxiliarDataProcedure という名前のプロシージャーもあります。

したがって、特定のステップで補足情報を保存または更新する必要がある場合は、[次へ] ボタンに関連付けられているイベント (Enter イベント) に次のコードを追加する必要があります:

&WizardData.FromJson(&WebSession.Get(&WebSessionKey))
WizardAuxiliarDataProcedure(
&WizardData.AuxiliarData, '<SomeKeyToIdentify>', <ValueForThisInfo>, 'SET')
&WebSession.Set(&WebSessionKey,&WizardData.ToJson())

SDT から補足情報を削除するには次のように操作します:

&WizardData.FromJson(&WebSession.Get(&WebSessionKey))
WizardAuxiliarDataProcedure(&WizardData.AuxiliarData, '<SomeKeyToIdentify>', '', 'DLT')
&WebSession.Set(&WebSessionKey,&WizardData.ToJson())

SDT から補足情報を取得するには次のように操作します:

&WizardData.FromJson(&WebSession.Get(&WebSessionKey))
WizardAuxiliarDataProcedure(&WizardData.AuxiliarData, '<SomeKeyToIdentify>', &Value, 'GET')

&Value 変数には、そのキーの値を設定します。

ウィザードの最後のステップには「FinishWizard」という名前のサブルーチンが追加されます。ここでは、ウィザードの各ステップでロードされたすべての情報、および前述のプロシージャーによってロードされた補足情報が格納されたウィザードの SDT (名前は &<WebPanelName>Data) を使用して、ウィザードに必要な動作を追加する必要があります。

 

 ウィザード Web パネルに関連付けられているプロパティは次のとおりです:

[Clean Next Step Data]: ウィザードの次のステップのフィールドを常に空にするかどうかを指定します。たとえば、ウィザードのステップ 3 が表示されているときにステップ 1 に戻って変更を加え、[次へ] を選択した場合に、ステップ 2 の情報を空にするか、エンドユーザーが入力した内容を表示するかをこのプロパティによって指定します。

WebPanel テンプレート「Wizard Arrow Type」に基づいたウィザード Web パネルの例

WebPanel テンプレート「Wizard Bullet Type」に基づいたウィザード Web パネルの例


Copyright © 2007-2015 DVelop Software Solutions - www.workwithplus.com