> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-rn-guide-message-privately.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Form Message

> Form Message — CometChat documentation.

The `FormMessage` class is used to create an interactive form message that can be sent via CometChat. It extends the `InteractiveMessage` class from CometChat.

### Constructor

| Name          | Type                  | Description                   |
| ------------- | --------------------- | ----------------------------- |
| receiverId    | string                | The ID of the receiver        |
| receiverType  | string                | The type of the receiver      |
| title         | string                | The title of the form         |
| formFields    | Array\<ElementEntity> | The fields of the form        |
| submitElement | ButtonElement         | The submit button of the form |

### Class Usage

How to create an instance of the `FormMessage` class:

<Tabs>
  <Tab title="TypeScript">
    ```ts theme={null}
    // Create an instance of APIAction
    let apiAction = new APIAction("https://example.com/api", "POST");

    // Create an instance of ButtonElement
    let submitButton = new ButtonElement("1", apiAction, "Submit");

    // Create an instance of TextInput
    let nameInput = new TextInput("1", "Please enter your name");
    // Create a new instance of FormMessage

    let formMessage = new FormMessage(
      "receiverId",
      CometChat.RECEIVER_TYPE.USER,
      "Title",
      [nameInput],
      submitButton
    );
    ```
  </Tab>
</Tabs>

### Key Properties and Methods

#### Goal Completion Text

The `setGoalCompletionText()` method sets the goal completion text of the form.

<Tabs>
  <Tab title="TypeScript">
    ```ts theme={null}
    let formMessage = new FormMessage(
      "receiverId",
      CometChat.RECEIVER_TYPE.USER,
      "Title",
      [nameInput],
      submitButton
    );
    formMessage.setGoalCompletionText("Goal completed");
    ```
  </Tab>
</Tabs>

### Creating a FormMessage from JSON

The static `fromJSON()` method creates an instance of `FormMessage` from a provided JSON object.

<Tabs>
  <Tab title="TypeScript">
    ```ts theme={null}
    // Create a FormMessage from JSON
    let json = {
      receiver: "receiverId",
      receiverType: CometChat.RECEIVER_TYPE.USER,
      type: "form",
      data: {
        interactiveData: {
          title: "Title",
          formFields: [],
          submitElement: new ButtonElement(
            "1",
            new APIAction("https://example.com/api", "POST"),
            "Submit"
          ),
        },
      },
    };

    let formMessageFromJSON = FormMessage.fromJSON(json);
    ```
  </Tab>
</Tabs>

### Example

Below is an example that showcases the creation and manipulation of an instance of `FormMessage`:

<Tabs>
  <Tab title="TypeScript">
    ```ts theme={null}
    // Create an instance of APIAction

    let apiAction = new APIAction("https://example.com/api", "POST");

    // Create an instance of ButtonElement

    let submitButton = new ButtonElement("1", apiAction, "Submit");

    // Create a new instance of FormMessage

    let formMessage = new FormMessage(
      "receiverId",
      CometChat.RECEIVER_TYPE.USER,
      "customType",
      "Title",
      [],
      submitButton
    );

    formMessage.setGoalCompletionText("Goal completed");

    // Create a FormMessage from JSON

    let json = {
      receiver: "receiverId",
      receiverType: CometChat.RECEIVER_TYPE.USER,
      type: "form",
      data: {
        interactiveData: {
          title: "Title",
          formFields: [],
          submitElement: new ButtonElement(
            "1",
            new APIAction("https://example.com/api", "POST"),
            "Submit"
          ),
        },
      },
    };

    let formMessageFromJSON = FormMessage.fromJSON(json);
    ```
  </Tab>
</Tabs>

In this example, a new instance of the `FormMessage` class is created. The title, form fields, submit element, and goal completion text are retrieved, updated, and retrieved again. Then a new `FormMessage` instance is made from a JSON object, and the title is retrieved and logged.