> For the complete documentation index, see [llms.txt](https://attr.sygnal.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://attr.sygnal.com/sa5-forms/sa5-forms-api.md).

# SA5 Forms API

{% hint style="info" %}
Our devs favor *TypeScript*, and class-centric encapsulated design. The examples here are written as such. If you are using vanilla JavaScript, adjust the code syntax to your needs.
{% endhint %}

## Controlling Form State

Setup the SA5 form object, to point to a named form; 

{% code overflow="wrap" %}

```typescript
let form: any; 
const formElem: HTMLElement | null = document.querySelector<HTMLElement>("[wfu-form='your-form-name']"); 
if(formElem)
   form = new sa5.Sa5Form(formElem); 
```

{% endcode %}

Set the form mode;

```typescript
this.form.setMode(0); // 0 = Active | 1 = Success | 2 = Error
```

## Typescript Definition

For devs using Typescript, you can declare SA5 Forms simply with;&#x20;

```typescript
declare namespace sa5 {

    enum WebflowFormMode {
        Active,
        Success,
        Error,
    }

    class Sa5Form {

        constructor(element: HTMLElement);

        setMode(mode: WebflowFormMode): void; 

    }

}
```

If you're using vanilla JavaScript, you do not need a declaration and can work with;

```javascript
window.sa5.Sa5Form
```