Save and Close Function Overview

The Save and Close functionality is designed to save the form data and then notify the iFrame host when complete. Here's the detailed breakdown:

1. UI Components

• The interface includes a Save & Close button that triggers the save and close process.

2. Event Handling Setup

• JavaScript event handlers are set up to listen for button clicks and initialize communication with the parent iFrame.

3. Main Save and Close Function

• The main function collects form data and sends it to the server, then handles the response.

4. Data Collection

• Gathers all form data, including the current Formio builder schema, and prepares it for submission.

5. iFrame Communication

• Uses window.parent.postMessage to send status messages to the parent iFrame host.

6. Error Handling

• Handles errors by resetting the UI, displaying error messages, and notifying the parent iFrame of failures.

7. iFrame Closure

• Attempts to close the iFrame and notifies the parent when the process is complete.

---

How It Works - Step by Step

1. Initialization: When the page loads, it sends a formBuilderReady message to the parent window.
2. Button Click: User clicks "Save & Close" button.
3. UI Feedback: Button shows loading state with spinner.
4. Data Collection: Collects all form data including the current Formio builder schema.
5. AJAX Request: Sends data to /Falcon/Forms/SaveAndClose endpoint.
6. Success Handling:
   • Sends formSaved message to parent with form details.
   • Calls closeIframe() to close the iframe.
7. Error Handling:
   • Resets button state.
   • Shows error message.
   • Sends formSaveError message to parent.
8. iFrame Closure: Attempts to close the iframe and notifies parent with formBuilderClosed message.

---

Message Types Sent to Parent

• formBuilderReady - When iframe is ready
• formSaved - When save is successful
• formSaveError - When save fails
• formBuilderClosed - When iframe is closing

---

This implementation ensures proper communication between the form builder iframe and its host application, providing real-time status updates and graceful error handling.