> ## Documentation Index
> Fetch the complete documentation index at: https://docs.chatnode.ai/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Custom Form

## Overview

**Custom Form** lets you create forms with fields that the AI Agent can use to collect and validate user inputs.

**Example:** A profile update form that asks for name, email, and preferences.

This feature is useful for **lead generation, surveys, customer support, and profile management**.

## How to Create a Custom Form

### **Step 1: Create a Custom Form**

1. Go to the **Actions** tab.

2. Click **List** from the left-hand menu.

3. Select **Create Action**.

<img className="block" src="https://mintcdn.com/chatnode-55/2HMEPn0IOnlaIVdX/images/server-action-one.webp?fit=max&auto=format&n=2HMEPn0IOnlaIVdX&q=85&s=2ccd092de9d1610bc9bd87cbd7ad2b97" alt="Server Action One" width="2914" height="952" data-path="images/server-action-one.webp" />

4. Choose **Custom Form** under Forms.

<img className="block" src="https://mintcdn.com/chatnode-55/vLxQUcFeBIXUl-sG/images/custom-form-one.webp?fit=max&auto=format&n=vLxQUcFeBIXUl-sG&q=85&s=eb882d8f733cede0abc5a59c7292b872" alt="Custom Form One" width="1222" height="744" data-path="images/custom-form-one.webp" />

5. Enter an **Action Title** in the pop-up window and click **Create**.

<img className="block" src="https://mintcdn.com/chatnode-55/vLxQUcFeBIXUl-sG/images/custom-form-two.webp?fit=max&auto=format&n=vLxQUcFeBIXUl-sG&q=85&s=c0484c4b109dd9678b8e2e43c070e0a8" alt="Custom Form Two" width="2038" height="922" data-path="images/custom-form-two.webp" />

6. You'll now see the form configuration screen.

### **Step 2: Basic Settings**

* **Name** → A descriptive name for the form. (e.g., update\_profile)

* **Description** → Explain when this form should be used. (e.g., **Collect user details to update their account.**)

<img className="block" src="https://mintcdn.com/chatnode-55/kq4juHBrTPOM3I5k/images/basic-settings-cf.webp?fit=max&auto=format&n=kq4juHBrTPOM3I5k&q=85&s=c5c0bfe59e611c46ee65845f93e66a20" alt="Basic Settings Cf" width="1744" height="654" data-path="images/basic-settings-cf.webp" />

### **Step 4: Add Inputs**

Each input represents a field in the form.

1. Click **Add Input**.

2. Define the field:

   * **Name** → Internal field name (e.g., email).

   * **Label** → User-facing text (e.g., **Email Address**).

   * **Placeholder** → Hint text (e.g., **Enter your email**).

   * **Type** → Select from Text, Email, Number, etc.

   * **Required** → Mark if mandatory.

Example Inputs:

* Full Name → Required text field.

* Email Address → Required email field.

* Preferences → Optional text field.

<img className="block" src="https://mintcdn.com/chatnode-55/voSbmewMUDsA6Upv/images/inputs-cf.webp?fit=max&auto=format&n=voSbmewMUDsA6Upv&q=85&s=ab115ffe33da11180ec4695d08cb5d0e" alt="Inputs Cf" width="1738" height="466" data-path="images/inputs-cf.webp" />

### **Step 5: Webhook (Optional)**

Send form submissions to an external system:

* Form data is sent as a **POST request in JSON format**.

* Configure the webhook endpoint in the **Settings tab**.

* Example Event Name: update\_profile\_custom\_form

<img className="block" src="https://mintcdn.com/chatnode-55/0YS3s-ubNlawEfQh/images/webhook-cf.webp?fit=max&auto=format&n=0YS3s-ubNlawEfQh&q=85&s=336bd8e50f2e4396e5f87c0657257d56" alt="Webhook Cf" width="1752" height="338" data-path="images/webhook-cf.webp" />

### **Step 6: Enable the Form**

At the top of the page, toggle from **Disable → Enable** to activate the form.

<img className="block" src="https://mintcdn.com/chatnode-55/vLxQUcFeBIXUl-sG/images/enable-form-cf.webp?fit=max&auto=format&n=vLxQUcFeBIXUl-sG&q=85&s=732ea72389d45c1339fd27fca51d2b62" alt="Enable Form Cf" width="1746" height="286" data-path="images/enable-form-cf.webp" />

## **Example Workflow**

1. User: **“I want to update my profile.”**

2. AI Agent triggers the **Custom Form**.

3. User fills in their **Name, Email, Preferences**.

4. AI Agent confirms: **“Your profile has been updated successfully!”**

5. (Optional) Data is sent to your backend via webhook.

With **Custom Forms**, your AI Agent can **collect structured inputs**, validate them, and pass them on to your systems — making it a powerful tool for onboarding, feedback, and customer data collection.
