ユースケース：概要ページの作成

次の例では、概要タイプの Web アプリケーションを作成して、データベースのすべての Web アプリケーションを表示します。次の要素を設定します。

フォルダーのフィルター（フォルダーのフィルターの追加を参照）
新しい Web アプリケーションを作成するためのボタン（新しい Web アプリケーションを設定するためのボタンの追加を参照）
リスト内の各エントリ用の詳細表示（リストへの詳細の追加を参照）
各リンク編集ツールごとのフィルター（リンクエディターを使用したフィルターの作成を参照）
更新リンク（更新リンクの作成を参照）

単一ページ Web アプリケーションの作成

単一ページ Web アプリケーションを作成し、アウトバウンドトランジションおよび次のページへのトランジションを無効にします。
ページタイトルの変更

このタイトルは、概要ヘッダーおよび Web アプリケーションの概要に表示されます。
Web アプリケーションプロパティで、単一ページ Web アプリケーションテンプレートを選択することで、アプリケーションのレンダリングを修正します。
Web アプリケーションのページアクティビティを開いて、リストを開きます（静的要素／リスト）。
リストの「データ」タブで、Web アプリケーションドキュメントタイプを選択し、ラベル、作成日およびアプリケーションのタイプ出力列を選択します。
「フィルター」サブタブで、次に示すように、Web アプリケーションのみを表示して、表示からテンプレートを除外するために、次のフィルターを作成します。
ページの設定ウィンドウを閉じて、「プレビュー」をクリックします。

データベースで使用可能な Web アプリケーションのリストが表示されます。

フォルダーに関するフィルターの追加

概要では、Adobe Campaign ツリーでの場所に応じてデータにアクセスすることを選択できます。これが、フォルダーのフィルターです。フォルダーのフィルターを概要に追加するには、次の手順に従います。

Web アプリケーションのページノードにカーソルを置いて、フォルダーを選択要素を追加します（高度なコントロール／フォルダーを選択）。
表示されるストレージウィンドウで、「変数を編集」リンクをクリックします。
ニーズに合わせて変数ラベルを変更します。
値 folder で変数名を変更します。

メモ

変数の名前は、フォルダーにリンクした要素の名前（スキーマで定義）に一致する必要があります（つまり、この場合は folder）。テーブルを参照する際に、この名前を再利用する必要があります。
変数に XML タイプを適用します。
ページを更新インタラクションを選択します。
リストにカーソルを置いて、「詳細設定」タブで、リストの「フォルダーのフィルター XPath」タブで前に作成した変数を参照します。フォルダーリンクに関係している要素の名前（つまり folder）を使用する必要があります。

メモ

この段階では、Web アプリケーションは、アプリケーションコンテキスト内にないので、フィルターは、フォルダーでテストできません。

新しい Web アプリケーションを設定するためのボタンの追加

ページ要素にカーソルを置いて、リンクを追加します（静的要素／リンク）。
概要のボタンに表示されるので、リンクラベルを修正します。

この例では、ラベルは "New" です。
「URL」フィールドに URL（xtk://open/?schema=nms:webApp&form=nms:newWebApp）を挿入します。

メモ

nms:webApp は、Web アプリケーションスキーマと一致します。

nms:newWebApp は、新しい Web アプリケーション作成ウィザードと一致します。
URL を同じウィンドウで表示することを選択します。
「画像」フィールドに Web アプリケーションアイコン /nms/img/webApp.png を追加します。

このアイコンは、「新規」ボタンに表示されます。
「スタイル」フィールドに "button" と入力します。

このスタイルは、前に選択した単一ページ Web アプリケーションテンプレートで参照されます。

リストへの詳細の追加

概要でリストを設定する場合、リストの各エントリに関する追加の詳細を表示することを選択できます。

前に作成したリスト要素にカーソルを置きます。
「一般」タブで、ドロップダウンリストから列と追加詳細表示モードを選択します。
「データ」タブで、プライマリキー、内部名および説明列を追加して、各列に対して「非表示フィールド」オプションを選択します。

これで、この情報は、各エントリの詳細にのみ表示されます。

「追加の情報」タブで、次のコードを追加します。

<div class="detailBox">
  <div class="actionBox">
    <span class="action"><img src="/xtk/img/fileEdit.png"/><a title="Open" class="linkAction" href="xtk://open/?schema=nms:webApp&form=nms:webApp&pk=
    <%=webApp.id%>">Open...</a></span>
    <%
    if( webApp.@appType == 1 ) { //survey
    %>
    <span class="action"><img src="/xtk/img/report.png"/><a target="_blank" title="Reports" class="linkAction" href="/xtk/report.jssp?_context=selection&
      _schema=nms:webApp&_selection=<%=webApp.@id%>
      &__sessiontoken=<%=document.controller.getSessionToken()%>">Reports</a></span>
    <%
    }
    %>
  </div>
  <div>
    Internal name: <%= webApp.@internalName %>
  </div>
  <%
  if( webApp.desc != "" )
  {
  %>
  <div>
    Description: <%= webApp.desc %>
  </div>
  <%
  }
  %>
</div>

メモ

JavaScript ライブラリは、サーバー上で更新するのに 5 分かかります。サーバーを再起動して、この遅延を待機するのを回避できます。

リストのフィルタリングと更新

ここでは、特定のオペレーターによって作成された Web アプリケーションの概要を表示するフィルターを作成します。このフィルターは、リンクエディターで作成されます。オペレーターを選択したら、リストを更新してフィルターを適用します。これには、更新リンクを作成する必要があります。

これら 2 つの要素は、概要で視覚的にグループ化させるために、同じコンテナにグループ化されます。

ページ要素にカーソルを置いて、コンテナ／標準を選択します。
列数を "2" に設定し、リンクエディターおよびリンクがお互い隣になるようにします。

要素のレイアウトについては、この節を参照してください。
dottedFilter を適用します。

このスタイルは、前に選択した単一ページ web アプリケーションテンプレートで参照されます。

リンクエディターを使用したフィルターの作成

前のステージで作成したコンテナにカーソルを置いて、高度なコントロールメニューからリンクエディターを挿入します。
自動的に開くストレージウィンドウで、「変数」オプションを選択してから、「変数を編集」リンクをクリックして、データをフィルターするための XML 変数を作成します。
ラベルを修正します。

概要の「フィルター」フィールドの隣に表示されます。
アプリケーションスキーマとしてオペレーターテーブルを選択します。
リスト要素にカーソルを置いて、データ／「フィルター」タブでフィルターを作成します。
- 式：「作成者」リンクの外部キー
- 演算子：等しい
- 値：変数
- 次の場合に考慮：'$(var2/@id)'!="