第7章 FHC を使用したフォームでの作業

7.1. FHC を使用したフォームプロジェクトの作成

概要

本チュートリアルでは、FHC を使用してフォームプロジェクトを構築する方法を説明します。このプロジェクトは、フォームクライアントアプリとクラウドアプリで構成されています。

要件

ユーザーは、以下のパーミッションを持つ 1 つ以上のチームメンバーである必要があります。

  • プロジェクト (表示 & 編集)
  • Drag & Drop App (表示 & 編集)

パーミッションについての詳細は、「チームおよびコラボレーション」を参照してください。

7.1.1. フォームプロジェクトの作成

最初にアプリフォームプロジェクトを作成します。これは、プロジェクト作成時に使用するテンプレートを指定することで行います。これでハイブリッドフォームアプリを含むプロジェクトが作成されます。

fhc projects create FormsProject forms_project

7.1.2. フォームの追加

フォームアプリを含むプロジェクトが作成されたら、次にフォームをそのアプリに関連付けます。これは、使用するフォームファイルへのパスを指定することで行います。

fhc forms create <form.json>

例を示します。

fhc forms create ~/Desktop/forms/smallForm.json

7.1.3. フォームをプロジェクトに関連付ける

プラットフォーム上でフォームが作成されたら、これをプロジェクト内のアプリに関連付けます。

fhc forms apps update <project-id> <form-id>

例を示します。

fhc forms apps update 534572a3fb19a3983fd92c15 5579624572fb19ajsfig398c

これでフォームがアプリに関連付けられました。fhc preview コマンドを実行すると、フォームの現在のステータスが確認できます。

fhc preview <app-id>

これでブラウザーにアプリのプレビューが読み込まれます。フォームがアプリに関連づけられていることが確認できますが、フォームには外観をよくするテーマが割り当てられていないため、見た感じはまだ最小限のものになっています。

7.1.4. テーマの作成

テーマはフォームと同様の方法で作成されます。fhc themes create コマンドを使用して theme.json ファイルを作成し、そのファイルへのパスを指定します。

fhc themes create <theme.json>

例を示します。

fhc themes create ~/Desktop/themes/CustomTheme.json

7.1.5. テーマをアプリに関連付ける

プラットフォームにテーマが追加されたら、作成済みのプロジェクトにこれを適用します。

注記

適用が関連付けられるのは個別のアプリではなく、プロジェクトになります。

fhc themes app set <project-id> <theme-id>

例を示します。

fhc themes app set HQgUjokQi7jizH8T-7TD4SQQ 534578160663a687117a4bd1

この時点では、機能するフォームプロジェクトにクライアントフォームアプリとクラウドアプリが含まれることになります。クライアントアプリには、フォームとテーマが関連付けられています。fhc preview <app-id> を使用するとプレビューが確認できます。プロジェクトにテーマが関連付けられたので、フォームの外観がより魅力的なものになっていることが確認できます。

7.1.6. 別のフォームアプリの追加

フォームベースのアプリをプロジェクトに追加したい場合は、以下のコマンドを実行します。

fhc apps create <project-id> <app-title> [<app-template-id>]

template-id では、'appforms_client' テンプレートを指定します。これでハイブリッドフォームアプリが作成されます。

注記

利用可能なアプリテンプレートを確認するには、'fhc templates apps' コマンドを使用します。

プロジェクトにフォームアプリを追加するには、以下のコマンドを実行します。

fhc apps create HQgUjokQi7jizH8T-7TD4SQQ Second_Form_App appforms_client

これで別のフォームベースのアプリがプロジェクト内に作成されました。アプリには、最初に実行した方法でフォームとテーマを関連付けることができます。

7.2. FHC を使用したフォームの作成

概要

本チュートリアルでは、アプリフォームのアプリで使用するフォームの作成方法を説明します。

要件

ユーザーは、以下のパーミッションを持つ 1 つ以上のチームメンバーである必要があります。

  • ドメイン — Drag & Drop Apps
  • フォーム (表示 & 編集)

パーミッションについての詳細は、「チームおよびコラボレーション」を参照してください。

7.2.1. 利用可能なフォームの一覧表示

fhc target を使用して希望するドメインをターゲットにします。

fhc target exampleDomain.feedhenry.com

fhc login コマンドを使用してログインします。

fhc login testUser@example.com password

ドメイン上の全フォームを一覧表示するには、fhc forms コマンドを使用します。

fhc forms

このコマンドで、ログインユーザーに割り当てられているパーミッションに基づくアクセスがある全フォームが一覧表示されます。

7.2.2. フォームの作成

フォームを作成するには、form.json オブジェクトを渡す必要があります。form.json オブジェクトを作成し、そのパスを書き留めます。本チュートリアルで使用する form.json ファイルの例は、以下の通りです。

{
   "description":"This is a test form",
   "name":"Test Form",
   "updatedBy":"testing-admin@example.com",
   "pageRules":[

   ],
   "fieldRules":[

   ],
   "pages":[
      {
         "name":"Page 1",
         "fields":[
            {
               "fieldOptions":{
                  "definition":{
                     "defaultValue":""
                  }
               },
               "required":false,
               "type":"text",
               "name":"Text",
               "helpText":"Text",
               "repeating":false
            },
            {
               "required":false,
               "type":"file",
               "name":"File",
               "helpText":"File",
               "repeating":false
            }
         ]
      },
      {
         "name":"Page 2",
         "fields":[
            {
               "required":false,
               "type":"text",
               "name":"Page 2 Text",
               "helpText":"Page 2 Text",
               "repeating":false
            }
         ]
      }
   ],
   "lastUpdated":"2014-01-22T16:51:53.725Z",
   "dateCreated":"2014-01-22T14:43:21.806Z",
   "pageRef":{
      "52dfd909a926eb2e3f000001":0,
      "52dff729e02b762d3f000004":1
   },
   "fieldRef":{
      "52dfd93ee02b762d3f000001":{
         "page":0,
         "field":0
      },
      "52dfd93ee02b762d3f000002":{
         "page":0,
         "field":1
      },
      "52dff729e02b762d3f000003":{
         "page":1,
         "field":0
      }
   },
   "lastUpdatedTimestamp":1390409513725,
   "appsUsingForm":123,
   "submissionsToday":1234,
   "submissionsTotal":124125
}

fhc を使用してフォームを作成するには、fhc forms create コマンドを以下のように使用します。

fhc forms create <form-file.json>

このコマンドで、JSON フォームオブジェクトをパラメーターとして渡す必要があります。ファイルのパスを以下のように指定します。

fhc forms create ~/Desktop/forms/form.js

これでプラットフォーム上にフォームが再作成されます。フォームが作成されたら、fhc forms get コマンドでフォームを表示させます。このコードを好きなディレクトリーにコピーしておくと、今後このフォームを編集したい場合に使用できます。別の方法では、以下のように fhc forms get コマンドの結果をファイルにプリントしておくこともできます。

fhc forms get <app-id> > ~/Desktop/formFile.txt

7.2.3. フォームの更新

開発中のある段階で、フォームの更新が必要になる場合もあるでしょう。これを行うには、フォームを保存したファイルのコンテンツを編集します。例えば、新たなテキストフィールドを追加する、またはあるルールをページに適用するといった場合、fhc forms update コマンドを使用すると既存フォームを更新することができます。

fhc forms update <path_to_form>

例を示します。

fhc forms update ~/Desktop/formFiles/form
注記

この更新コマンドで最初にフォームを作成した際に使用したフォームファイルへのパスを渡すと、このファイルには ID が割り当てられていないので、フォームを複製することになります。つまり、フォームを更新するのではなく、新しいインスタンスが作成され、新たな ID が割り当てられます。

これで変更が適用されます。

プロジェクトにフォームを関連付ける方法については、アプリフォームプロジェクトの作成 チュートリアルの プロジェクトにアプリフォームを関連付ける セクションを参照してください。

7.3. FHC を使用したフォームの提出の作成

概要

本チュートリアルでは、フォームの提出の一覧表示、取得、生成の方法を説明します。

要件

ユーザーは、以下のパーミッションを持つ 1 つ以上のチームメンバーである必要があります。

  • ドメイン — Drag & Drop Apps
  • フォーム (表示 & 編集) — 提出 (表示 & 編集)

パーミッションについての詳細は、「チームおよびコラボレーション」を参照してください。

このチュートリアルを行うには、フォームが作成されている必要があります。新規フォームの作成については、フォームの作成 を参照してください。

7.3.1. 提出の一覧表示

フォームの提出を一覧表示するには、fhc submissions または fhc submissions list コマンドを使用します。

fhc submissions list

これでアクセス可能な全フォームの提出が一覧表示されます。

7.3.2. 特定提出の応答

fhc submissions get コマンドを使用すると、ID に基づいて特定の提出を返すことができます。

fhc submissions get <submission-id>

これで特定の提出が返されます。.pdf 接尾辞をファイル名に加えると、提出を PDF 形式で保存することもできます。

fhc submissions get <submission-id> <filename>.pdf

例を示します。

fhc submissions get 534cf14de078a2c47291e5b3 savedSubmission.pdf

7.3.3. 提出のステータス

fhc submissions status コマンドを特定の提出の ID と実行すると、その提出のステータスを確認できます。

fhc submissions status 5335bc00d4598fdb5cae04f7

7.3.4. 提出の送信

fhc submissions submitdata コマンドで submission.json ファイルを渡すと、提出のデータを送信することができます。

fhc submissons submitdata <submission.json>

例を示します。

fhc submissions submitdata ~/Desktop/templateForSubmission.json

提出に完了の push mark を行うには、fhc submissions complete <submission-id> コマンドを使用します。

fhc complete submissions complete 5335bc00d4598fdb5cae04f7

PDF として保存した場合と同様に、提出は zip ファイルとして保存することも可能です。これは、あるプロジェクトにいくつもの提出がある場合に便利です。

fhc submissions export file=<zip-file> app=<project-id> || form=<form-id>

注記

プロジェクトのパラメーターは、app=<project-id> のアプリフィールドに渡されます。

fhc submissions export file=submissions.zip app=H_DNbFNJWS9uZIt7LJOkut20

7.4. FHC を使用したフォームテーマの作成

概要

このチュートリアルでは、FHC を使用してフォームにテーマを作成する方法を説明します。

要件

ユーザーは、以下のパーミッションを持つ 1 つ以上のチームメンバーである必要があります。

  • ドメイン — Drag & Drop Apps
  • テーマ (表示 & 編集)

パーミッションについての詳細は、「チームおよびコラボレーション」を参照してください。

7.4.1. テーマの一覧表示

fhc target コマンドを使用してドメインをターゲットにします。fhc login を使用してログインします。

ドメイン上の全テーマを一覧表示するには、fhc themes コマンドを使用します。

7.4.2. テーマの作成

テーマの作成には、fhc themes create コマンドを使用します。このコマンドでは、パラメーターに json ファイルを渡す必要があります。

fhc themes create <theme-file.json>

例を示します。

fhc themes create ~/Desktop/themes/theme.json

これでプラットフォーム上に指定されたテーマが作成されます。テーマには ID が割り当てられます。

テーマが正常に作成されると、コンソールに出力されます。

出力をファイルに保存し、パスを書き留めます。このパスは、テーマ更新の際に使用されます。

7.4.3. テーマをアプリに関連付ける

テーマをアプリに追加する前に、まずアプリをプロジェクトに関連付ける必要があります。アプリをプロジェクトに追加する方法については、プロジェクトおよびアプリに関する作業 を参照してください。

テーマをアプリに関連付けるには、fhc themes app set コマンドを使用します。

fhc themes app set <app-id> <theme-id>

例を示します。

fhc themes app set x5KmSy0gXPZOvpD_hHqCOwZe zRdUezAD3l11huedCk-WJswZ

7.4.4. テーマの更新

ある段階でテーマを更新するには、fhc themes update コマンドを使用します。テーマを作成した後に保存した場所に移動します。そこで変更を加えてから、ファイルを保存します。これでテーマを更新することができます。

fhc themes update ~/Desktop/themes/theme.json

これで変更が読み込まれます。更新されたテーマは、再度コンソールに出力されます。