← All install guides

For developers

Tell Formleak more about your forms.

The one line of code finds normal forms by itself. These optional markers help when your site is built in an unusual way. None of them makes Formleak read what people type.

Forms without a <form> tag

Many app-style sites put fields in a <div> and send them with a button click. Formleak only looks inside forms, so mark the area that holds the fields. The name you give it is the form's name in your reports.

<div data-formleak-form="press-release">
  <input name="url">
  <button data-formleak-submit>Fetch</button>
</div>

An element with role="form" counts as a form too (then its id is the name). Changing the code to use a real <form> with an onSubmit handler works just as well, and lets people press Enter to send.

Which button sends it

A click on data-formleak-submit counts the form as sent straight away. Use it on the button that really sends (or goes to the next step). Without it, Formleak treats any button click as an attempt and counts the form as sent when it disappears or a success message appears.

Prefer to tell Formleak from your own code, after a successful save? Call:

window.formleak.submitted("press-release"); // the form's name, an element or a CSS selector

Choice cards and toggle buttons

Cards, toggles and switches built from buttons are tracked when they use the standard accessible markup: role="radio" inside a role="radiogroup" (named with aria-label), role="checkbox", role="switch" or aria-pressed. A group counts as one field. Formleak notes that an option was picked, never which one.

<div role="radiogroup" aria-label="Angle">
  <button role="radio" aria-checked="true">Brand exposure</button>
  <button role="radio" aria-checked="false">Keyword exposure</button>
</div>

No accessible markup? Put data-formleak-field="angle" on the element around the options.

Success messages

If your form shows a thank-you message instead of loading a new page, mark it. It counts as sent when the message appears within 10 seconds of a send attempt.

<p data-fd-success="press-release">Thanks, we'll be in touch!</p>

Fields to leave out

Add data-fd-ignore to a field Formleak shouldn't count, like a search box inside a form.

Pre-filled fields

Nothing to add. When a form is sent, Formleak notes for each field your site had already filled in whether it was kept or changed (never the text). Read-only and disabled fields are left out.