Forms

Webflow Forms enable users to capture and collect information from visitors on a site. Forms are essential for gathering user data, feedback, and enabling key interactions.

Form structure

A Webflow form consists of several nested elements that work together:

The methods documented below apply specifically to the FormForm and FormWrapper elements. For more information about creating and styling forms, see the Forms lesson in Webflow University.

Properties

Methods

form.getName()

Retrieves the name of the form.

Syntax

1
form.getName(): Promise<string>

Returns

Promise<name>: String - The name of the form.

Example

1
const selectedElement = await webflow.getSelectedElement()
2
3
if (selectedElement?.type === 'FormForm' || selectedElement?.type === 'FormWrapper'){
4
5
  const name = await selectedElement.getName()
6
  console.log(name)
7
8
} else {
9
  console.log("Selected Element is not a Form Element")
10
}

form.setName(name: string)

Sets the name of the form.

Syntax

1
form.setName(name: string): Promise<null>

Parameters

• name: String - The name of the form.

Returns

Promise<null>

A Promise that resolves to null.

Example

1
const selectedElement = await webflow.getSelectedElement()
2
3
if (selectedElement?.type === 'FormForm' || selectedElement?.type === 'FormWrapper'){
4
5
  await selectedElement.setName("My Form")
6
7
} else {
8
  console.log("Selected Element is not a Form Element")
9
}