フォーム送信時に確認ポップアップを表示する方法

フォーム送信時に確認ポップアップを表示する方法

お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

フォーム送信時に確認ポップアップを実装すると、ユーザーの処理内容を検証し、次の処理に進む前に確認できます。ユーザーがデータを送信する際に、確認ダイアログボックスが表示されます。この機能により、意図しないフォーム送信を防止し、重要な処理に対して追加の検証レイヤーを提供することで、ユーザーエクスペリエンスが向上します。以下の手順を、アプリケーション内の任意のメインフォームに設定することで、送信時に確認ポップアップを表示できます。
  1. 新規作成したフォームに、確認ポップアップとして表示するため、次の詳細を設定します。

    フォーム名

    フォームリンク名

    項目タイプ

    項目名

    項目リンク名

    Confirmation Pop-up

    Confirmation_Popup

    (このフォームを複製して、ステートレスフォーム送信を確定しますか?」という名前と、リンク名Confirm_Submitで作成します)

    メモ


    メモ
     
    Notes
    メモ: メモ項目に入力した内容は、ポップアップと一緒にユーザーに表示されます。例えば、メッセージ「フォームを送信してもよろしいですか?」と入力しています。

    メモ

    複数行

    Temp Data

    Temp_Data

  2. ステートレスフォーム「送信を確定しますか?」のフォームプロパティに移動し、送信ボタンとリセットボタンの名前を、それぞれ確定キャンセルに変更します。また、これらのボタンのタイプを送信およびリセットから「ボタン」に変更します(以下のとおり)。

  3. ワークフローを作成し、ステートレスフォーム「送信を確定しますか?」内のTemp_data複数行項目を、内部用途で使用するため非表示にします。フォームイベントとして項目ルールを選択し、ワークフロー名を「項目を非表示」にします。

  4. 追加する > 新規操作 > 項目を非表示をクリックし、表示される画面でTemp Data項目を選択します。

  5. 新しいワークフローを作成し、標準フォーム(メインフォーム)のフォーム送信成功時に実行されるよう設定して、データが送信されるたび(作成または編集)に確認ポップアップを表示します。

  6. 追加する > 新規操作 > Deluge Scriptをクリックし、次のコードを Deluge エディターに追加します。これにより、メインフォーム内の各項目に入力された値を取得し、JSON 形式に変換します。生成された JSON は、送信を確定しますか?ポップアップフォーム内の非表示のTemp_Data複数行項目に設定されます。
    1. //Fetchを使用して、ID を入力データの ID と照合し、追加されたデータを取得します。
    2. sourceRecord =<Main_form_link_name>[ID == input。ID];
    3. //getFieldNames();関数を使用して、Asset_Requests フォーム内のすべての項目のフィールドリンク名を取得します。
    4. fieldNames = sourceRecord。getFieldNames();
    5. //マップ変数を作成し、フィールドリンク名とその値を JSON 形式で保存します。
    6. jsonObject = Map();
    7. for each 項目 in fieldNames
    8. {
    9. 値 = sourceRecord。getFieldValue(項目);
    10. jsonObject。put(項目,値);
    11. }
    12. //toString(); 関数を使用して、JSON をテキストに変換します。
    13. jsonString = jsonObject。toString();
    14. //encodeを使用して JSON 文字列をエンコードし、URL パラメーターに値を渡します。
    15. encoded_json = encodeUrl(jsonString);
    16. //確認ポップアップをトリガーする前に、入力値をクエリパラメーターとして渡してメインフォームを開きます。これにより、送信後のフォーム更新時に項目値がクリアされることを防ぎます。
    17. openUrl('#Form:<Main_form_link_name>?<Field_link_name_1>='+input.<Field_link_name_1>+'&<Field_link_name_2>='+input.<Field_link_name_2>+'&<Field_link_name_3>='+input.<Field_link_name_3>,'same window');
    18. //開くを使用して、ポップアップで「確定して送信しますか?」というステートレスフォームを開き、JSON 値を Temp_Data 複数行項目に渡します。
    19. openUrl('#Form:Confirm_Submit?Temp_Data=' + encoded_json,'popup window','height=300,width=500');
    20. //削除を使用して、ユーザーの確認なしにレコードが残らないよう、送信済みデータを削除します。
    21. 削除 差出人 <Main_form_link_name>[ID == sourceRecord];
    22. ここで、

      <Main_form_link_name>

      は、ユーザーが[送信]をクリックしたときに確認ポップアップが表示されるフォームのリンク名です。

  7. フォームワークフローを作成し、ボタンのクリック時確定して送信しますか?ステートレスフォームで実行されるように設定し、ボタンとして確定を選択します。ワークフロー名を「送信データ」とします。

  8. 新しいアクションを追加 > Deluge Script]をクリックし、次のコードを Deluge エディターに追加します。これにより、ユーザーがポップアップで確定ボタンをクリックしたときに、確定して送信しますか?ポップアップの Temp_Data 項目に JSON として保存されている取得済み入力値を使用して、メインフォームにレコードが挿入されます。
    1. //Temp_Data 項目に保存された JSON データを使用し、JSON キーとフィールドリンク名を照合して、メインフォームにレコードを追加します。
    2. insert into <Main_form_link_name>
    3. [
    4. Added_User=Zoho。loginuser
    5. <Field_link_name_1>=input。Temp_Data。getJSON('<Field_link_name_1>')
    6. <Field_link_name_2>=input。Temp_Data。getJSON('<Field_link_name_2>')
    7. <Field_link_name_3>=input。Temp_Data。getJSON('<Field_link_name_3>')
    8. ];
    9. //ユーザーをメインフォームにリダイレクトします。
    10. openUrl('#Form:<Main_form_link_name>','same window');
  9. 別のワークフローを作成し、ボタンのクリック時確定して送信しますか?ステートレスフォームで実行されるように設定し、ボタンとしてキャンセルを選択します。ワークフロー名を「キャンセルデータ」とします。

  10. 新しいアクションを追加 > Deluge Script]をクリックし、次のコードを Deluge エディターに追加します。これにより、ユーザーがポップアップでキャンセルボタンをクリックしたときに、確定して送信しますか?ポップアップが閉じられます。
    1. //「確定して送信しますか?」ポップアップウィンドウを閉じます。
    2. openUrl('#Script:page。閉じる ','popup window');
  11. メインフォームのフォームプロパティに移動し、メッセージを表示項目の内容をクリアします。これにより、ユーザーが送信をクリックしたときに完了トーストが表示されず、確認ポップアップのみが表示されるようになります。

動作を確認する

  1. ステートレスフォーム
  2. getFieldNames()
  3. encodeURL()
  4. openURL()
  5. レコードを追加
  6. レコードを削除