# 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
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://attr.sygnal.com/sa5-forms/sa5-forms-api.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.