レポート作成者ガイド
チュートリアル
9: 差し込み印刷レポート
V3.0J
V3.0JV2.2JV2.1JV2JV1J

差し込み印刷レポート

概要

差し込み印刷機能は、事前に定義されたテンプレートにデータレコードを適用することにより、一度に複数の文書を生成する方法です。ActiveReportsJSでは、さまざまな方法を使用して差し込み印刷レポートを作成できます。文書のテンプレートをHTMLフラグメントとして表現できる場合、MixedFormatTextコントロールをListデータ領域と一緒に使用して、このようなレポートを作成できます。差し込み印刷レポートの例としては、レター、クーポンなどがあります。

このチュートリアルでは、クーポンコード一覧を含むレポートを作成する手順を説明します。

  • 新しいレポートを作成する
  • レポートをデータ連結しデータセットを追加する
  • Listデータ領域を追加する
  • Listデータ領域を構成する
  • リストをグループ化する
  • MixedFormatTextコントロールを追加する

前提条件

次の内容は、デザイナアプリを使用することを前提としています。詳細については、チュートリアルを参照してください。また、データソースとして利用するGrapeCity Data Serviceにアクセスするには、インターネット接続環境が必要です。

新しいレポートを作成する

デザイナアプリにて、［ファイル］メニューをクリックし、［RDLレポート］を選択して、新しいレポートを作成します。デザイン面の周囲にあるグレーの領域をクリックし、表示されるより、［余白］セクションの［スタイル］に「狭い」を設定し、余白を設定します。

新しいレポートの作成方法

Creating a new report

レポートをデータ連結しデータセットを追加する

レポートとデータの接続を行うため、データ連結を行います。このチュートリアルでは、データソースとして「GrapeCity Data Service」のContoso Retail Data Serviceを使用します。

  • データソースを追加する

    データに接続するため、「Contoso Retail Data Service」のWebAPIを使用します。このチュートリアルではDimPromotionsのデータを使用します。データソースを作成するには、次の手順を実行します。

    • データタブを開き、［データソース］の横の［+ 追加］アイコンをクリックします。
    • ［データソースの編集］ダイアログで、［名前］に「Contoso」と入力し、［エンドポイント］に「https://demodata-jp.grapecity.com/contoso/odata/v1」と入力します。
    • ［変更を保存］ボタンをクリックします。

データソースを追加する方法

Adding data source

  • データセットを追加する

    データセットは、データソースの1つ以上のエンドポイントを表します。このチュートリアルでは「クーポンコード一覧」を作成するため、先ずDimPromotionsの値を取得します。以下の手順に従ってPromotionsデータセットを追加します。

    • データタブをクリックし、「Contoso」データソースの横の［+ 追加］アイコンをクリックします。
    • ［新規データセット］ダイアログで、［名前］に「Promotions」と入力、［URI/パス］に「/DimPromotions」と入力し、［JSONパス］に「$.value.*」と入力します。
    • そのままですと「Promotions」には不要なデータが含まれています。以下のようにクエリパラメータを使用して必要なフィールドのみ取得します。
      • ［パラメータ］の右側にある［+ 項目追加］アイコンをクリックします。
      • 新しく追加された［パラメータ］に「$select」と入力します。
      • ［値］に「PromotionKey, PromotionName, DiscountPercent, StartDate, EndDate」と入力します。
    • ［検証］ボタンをクリックします。
    • ［データベースフィールド］に［5項目］というテキストが表示されていることを確認します。
    • ［データベースフィールド］セクションを展開し、［StartDate］フィールドのDataFieldプロパティを「StartDate[Date]」に、［EndDate］フィールドのDataFieldプロパティを「EndDate[Date]」に設定します。
    • ［変更を保存］ボタンをクリックします。

データセットを追加する方法

Adding data set

Listデータ領域を追加する

クーポンコード一覧を表示するには、Listデータ領域を使用します。

  • ツールバーの左側のツールボックスからListコントロールをドラッグ＆ドロップしてレポートの左上隅に配置します。
  • 配置したListを選択します。
  • ［データセット名］プロパティにドロップダウンリストから［Promotions］を選択し、［幅］プロパティを「7.5in」に設定します。これによってBandedListはレポートのページサイズと余白によって定義されるレポートの印刷可能領域に適合します。
  • ［高さ］プロパティを「5in」に設定します。
  • ［データ］セクションの［フィルタ］プロパティの横の［+ 追加］アイコンをクリックします。
  • ［+ 追加］ボタンをクリックし、リストから［DiscountPercent］を選択します。
  • フィルタ演算子では「>」を選択し、右側にあるテキスト領域に「0」と入力します。

Listを追加する方法

Adding list

リストをグループ化する

各クーポンコードを別々のページに表示するには、リストをグループ化します。

  • ［←］アイコンをクリックし、［フィルタ］エディタを終了します。
  • ［グループ］セクションの［式］プロパティの右側にあるリストアイコンをクリックします。
  • 新しく追加された項目の右側にあるグレーのボックスをクリックし、ドロップダウンリストで「PromotionKey」を選択します。
  • ［改ページ］プロパティを「Between」に設定します。

MixedFormatTextコントロールを追加する

MixedFormatTextコントロールを使用して、クーポンコードの詳細を表示します。

  • ツールバーの左側のツールボックスからMixedFormatTextコントロールをドラッグ＆ドロップしてListデータ領域の左上隅に配置します。
  • 配置したMixedFormatTextをクリックし、以下のプロパティを設定します。
プロパティ 値
位置とサイズ > 上 0in
位置とサイズ > 左 0in
位置とサイズ > 幅 7.5in
位置とサイズ > 高さ 5in
罫線 > 幅 5pt
罫線 > スタイル Dotted
罫線 > 色 #bbb
レイアウト > パディング 16pt 2pt 16pt 2pt

［値］プロパティの右側にあるグレーのボックスをクリックし、［式］を選択します。式エディタでは次の値を設定し、［保存］ボタンをクリックします。

<h2 style="text-align:center;">{PromotionName}</h2>
<h1 style="color:red;text-align:center;>{Format(DiscountPercent, "P0")} OFFクーポン<sup>*</sup></h1>
<h3 style="text-align:center;"><sup>*</sup>利用期間： <b>{Format(StartDate, "d")}</b> ～ <b>{Format(EndDate, "d")}</h3>
<p style="text-align:justify;"><sup>*</sup>ほかのクーポンとの併用はできません。</p>
<p style="text-align:justify;"><sup>*</sup>クーポンコードには金銭的な価値はありません。</p>
<p style="text-align:justify;"><sup>*</sup>Northwind Tradersは、クーポンをいつでも中止する権利を留保します。</p>

サポートされているHTMLタグとCSSスタイルの完全なリストについては、MixedFormatTextを参照してください。

レポートを表示する

レポートをプレビューし、クーポンコードのリストをナビゲートできます。レポートを印刷したり、PDFにエクスポートしたりできます。［改ページ］プロパティを「Between」に設定したので、各クーポンは別々のページに表示されます。