Forms

How to set up form fields (placeholders, required, types)

September 15, 2026
How to set up form fields (placeholders, required, types)

In TeleportHQ, each form field's settings are in the right panel, in the Attributes section. Select the field on the canvas, then change placeholder (the grey hint text), switch on required so visitors can't skip it, pick a type such as email or tel, and set name, which becomes the field's column title in your submissions.

Before you start

  • Add a form with fields first. See How to create a form.
  • Fields added with + Add elements already have a sensible type, name and placeholder. For example, Email gets the type email, the name email and the placeholder "Email".
  • To check what visitors type (a phone number, a postal code, a text length) and show your own message when a value is refused, use the form's Field rules instead. They set the same attributes for you. See How to check what visitors type in a form field.

Steps

  1. On the canvas, click the field you want to change, for example the Phone input.
  2. In the right panel, find the Attributes section. If it's folded, click its title.
  3. Change the settings you need:
    • placeholder: type the hint shown inside the empty field, for example +1 555 123 4567.
    • required: turn it on to stop the form from sending while the field is empty.
    • type: choose what the field accepts: text, number, email, password, tel, date, time or datetime-local.
    • name: type a short name without spaces, for example phone.
  4. Repeat for the other fields.
The TeleportHQ Attributes section for a selected form input, with its type, name, placeholder and required settings

Settings for each kind of field

In TeleportHQ, the Attributes section shows different settings depending on the field:

FieldSettings in Attributes
Input (single line)type, name, value, placeholder, disabled, required, autoFocus, autoComplete
Textarea (long answer)name, placeholder, cols, rows, disabled, autoFocus, autoComplete
Checkbox and Radio Buttonname, defaultChecked, checked, disabled, required, autoFocus, autoComplete, value
Select (dropdown)name, multiple, size, disabled, required, autoFocus, autoComplete
Option (a dropdown choice)disabled, value
Labelfor
Buttonname, disabled, autoFocus, type (submit, reset, button)

Tips:

  • Dropdown choices. A Select holds Option elements. Select an option to edit its text and its value. To make a dropdown required, give its first option an empty value, such as a "Choose a size" option: the dropdown counts as empty while that option is chosen.
  • Radio buttons. Give every radio button in a group the same name, so visitors can pick only one.
  • Submit button. Make sure the button's type is submit or empty. A button with the type button doesn't send the form.
  • autoComplete lets browsers fill in known details. For example, set it to email on an email field.

How field names appear in your submissions

TeleportHQ uses each field's name as its column title in the Submissions tab, with the first letter of each word in capitals: a field named phone becomes the Phone column. The same name labels the field in notification emails, the CSV download and the PDF of a submission. A field without a name gets one made up by TeleportHQ, such as textinput k3j2f, so give each field a clear name before you publish.

Check that it worked

  1. Click Preview in the toolbar at the bottom of the editor, or open your published site.
  2. Try to send the form with a required field empty. The browser asks you to fill it in.
  3. Type a wrong email into an email field. The browser warns you.

Troubleshooting

My answers show up under odd column names in Submissions The fields had no name, so TeleportHQ made one up. Give each field a clear name, such as phone or message, and publish again. New submissions use the new names.

The placeholder text doesn't change on the live site Publish again after editing. Changes in the editor reach your live site only when you publish.

The form sends even though a field is empty Check that required is on for that field, and that the field sits inside the Form element. A Textarea has no required setting in Attributes: use Required in the form's Field rules. See How to check what visitors type in a form field.

Good to know

Share

Related Articles

How to create a form

In TeleportHQ, you create a form by adding a Form element from Elements → Primitives, by adding a ready-made Contact Form, Sign Up or Sign In section, or by asking the AI Assistant; then click + Add elements to insert fields such as Name, Email and Phone, and publish so submissions reach Growth → Forms.

How to check what visitors type in a form field

In TeleportHQ, open the form's Manage Form window (Growth → Forms → Settings), go to Field rules, pick a field, and set Required, a Format such as Email address, Phone number or Text length, a Pattern for your own format, and the Message when the value is refused; click Save and publish, and the visitor's browser checks the field before the form is sent.

How to choose what happens after someone submits a form

In TeleportHQ, you open a form's Manage Form window (Growth → Forms → Settings) and, on the Settings tab, choose what visitors see after submitting (an alert, a component, a page or a web address), who gets an email for each submission (up to 3 addresses, the workspace owner first), and when the form closes (an expiration date or a submission limit); click Save and publish.

How to see and export form submissions

In TeleportHQ, you see form submissions in Growth → Forms → Form submissions by picking a form in the Your forms list, where you search, open and edit entries, mark them as spam, move them to trash, download one as a PDF, or click Download submissions to export them as a CSV file.

How to let visitors upload files in a form

In TeleportHQ, you let visitors attach files (such as a CV or photos) by adding a File Upload Field to your form, linking it to a page state, and attaching an On Form Submit workflow that reads the state and saves the files with an Upload File(s) step; the field works on any website, but the workflow makes the project a web app.

Why is my form not working?

A TeleportHQ form usually stops collecting submissions because the site is hosted outside TeleportHQ ("Domain not allowed"), the changes weren't published, the form's storage is off or handled by a workflow, an action attribute overrides it, a field rule refuses the value, the form expired or hit a limit, or reCAPTCHA keys don't match the domain.