ビューコントロールを追加する

XPage ビューコントロールは、定義済みビューの情報を表示するために使用します。 このレッスンで作成するコントロールを使用して、SiteList ビューのデータを表示することができます。

1. [コンテナコントロール] から、[ビュー] を選択して XPage にドラッグします。
2. [ビューのデータソースの選択] ウィンドウで、以下の手順を実行します。
   1. [表示するデータのソース] の設定を [Domino ビュー] のままにしておきます。
   2. [アプリケーション] の設定を [現在の] のままにしておきます。

      任意の Domino アプリケーションを選択できますが、 そのアプリケーションがランタイムサーバーで使用可能にならなければビューコントロールは機能しません。

   3. [ビュー] ドロップダウンリストで、[SiteList] を選択します。
   4. データソース名として [view1] を受け入れます。

      この名前は、サーバーサイド JavaScript コードで使用できます。

   5. 最後にある列のリストで、[サイト名]、[住所]、[市区町村]、[サイトタイプ] のチェックマークが付けられたままにしておきます。

   ウィンドウは、下の画面キャプチャのようになります。

   

3. [OK] をクリックします。

   ビューを表す表が表示されます。 4 つの列はビューの列を表し、2 つの行は列タイトルと列の内容を表しています。 最初の行には、ユーザーがビュー内のデータをナビゲートするためのページャコントロールが含まれます。

4. ビューコントロールを、以下のように調整します。
   1. 列のサイズを変更するには、最初の行のセルをクリックして [Shift] キーを押しながら 2 番目のセルをクリックすることによって 1 つの列で両方の行を選択してから、いずれかのセルのハンドルをドラッグします。
   2. ヘッダー行の最初のセルをクリックして [Shift] キーを押しながら行内の残りのセルをクリックすることにより、ヘッダー行全体を選択します。 [Ctrl] + [B] を押すか、フォントプロパティを使用して、これらのセルを太字にします。
5. ビューコントロールの最初の列で文書をクリックすることによりユーザーが文書を開くことができるようにします。
   1. 左下のセル (サイト名) の中をクリックします。
   2. 下部ペインの [プロパティ] タブで [表示] をクリックします。
   3. [列の値をリンクとして表示する] を選択します。

   ページは、下の画面キャプチャのようになります。

   

6. ビューコントロールを編集ページにリンクします。
   1. ビューコントロールをクリックして、ビュー全体をフォーカスします。
   2. 下部ペインの [プロパティ] タブで [ビュー] をクリックします。
   3. 最後にある [実行時に、選択した文書を次の設定を使用して開く] ドロップダウンリストから [Site1] を選択します。
7. ページを保存してプリビューします。
   1. 実際の XPage 自体をクリックして、ページ自体をフォーカスします。

      ページをフォーカスするには、サイドペインで [アウトライン] > [ルート文書] > [XPage] をクリックするという方法もあります。 このアクションによって、ページ自体がフォーカスされます。ページで特定の設計要素をフォーカスするには、アウトラインで該当する要素をクリックします。

   2. [Ctrl] + [S] を押して、ページを保存します。
   3. [設計] > [Web ブラウザでのプリビュー] > [デフォルトのシステム Web ブラウザ] または別の任意のブラウザをクリックします。 リストの文書をクリックします。 その文書が [Site] XPage で開きます。 このウィンドウで文書を変更して、[送信] をクリックすると文書を保存できます。 ページを送信しても、自分がページから移動することはないため、引き続き同じ文書を編集して保存することができます。
      変更を保存してブラウザを更新するには、次のようにいくつかの方法があります。

      • このチュートリアルで使用する [送信] タイプのボタンで、データソースを更新してページを更新する。
      • [ボタン] ボタンを使用すると、シンプルアクションまたは JavaScript を onclick イベントに付加することができます。 このイベントを使用して、データソースを更新し、ユーザーを別のページにリダイレクトします。
      • ページイベントで、シンプルアクションまたは JavaScript を postSaveDocument イベントに添付する。 [送信] ボタンをページに配置して、postSaveDocument イベントでユーザーを別のページにリダイレクトできます。

      XPage は SiteList1 のようになります。開いて比較することができます。

8. ブラウザを閉じます。