BETA
Skip to content

Field Types

Krafter Forms supports all standard HTML input types and provides a visual form builder in the dashboard. This page covers supported field types, special fields, and how to use the form builder.

Supported Input Types

The following HTML input types are supported as form fields:

TypeHTML ElementDescription
text<input type="text">Single-line text input
email<input type="email">Email address with validation
textarea<textarea>Multi-line text input
number<input type="number">Numeric input
tel<input type="tel">Telephone number
url<input type="url">URL with validation
select<select>Dropdown selection
checkbox<input type="checkbox">Boolean toggle or multi-select
radio<input type="radio">Single selection from options
hidden<input type="hidden">Hidden value (not shown to user)
date<input type="date">Date picker

TIP

You do not need to define fields in advance. The public endpoint accepts any field name. Defining fields is optional and mainly used for the form builder, HTML snippet generation, and validation.

Form Builder

The dashboard includes a visual form builder for configuring fields without writing HTML.

Features

  • Add fields -- Select a field type and give it a name and label
  • Remove fields -- Delete fields you no longer need
  • Reorder fields -- Drag and drop to change field order
  • Configure options -- Set required, placeholder, and default values
  • Select/radio options -- Define the list of options for dropdown and radio fields

HTML Snippet Generation

Once you have configured your fields in the builder, click HTML Snippet to generate a ready-to-use HTML form. The generated snippet includes:

  • Correct action and method attributes
  • All configured fields with labels and attributes
  • A honeypot field for spam protection
  • A submit button

You can copy the snippet directly into your website.

Special Fields

Field names prefixed with _ (underscore) have special behavior and are not stored as part of the submission data.

_honeypot / _gotcha

Hidden fields for spam detection. If a bot fills in these fields, the submission is flagged as spam.

html
<!-- CSS-hidden honeypot field -->
<div style="position: absolute; left: -9999px;">
  <input type="text" name="_honeypot" tabindex="-1" autocomplete="off">
</div>

See Spam Protection for details.

_redirect

URL to redirect the user to after a successful submission. Only used for HTML form submissions (not JSON).

html
<input type="hidden" name="_redirect" value="https://yoursite.com/thank-you">

_subject

Override the default email notification subject line. The default subject is "New submission: {form name}".

html
<input type="hidden" name="_subject" value="New contact request">

_replyto

Specify the form field name whose value should be used as the reply-to address in notification emails. This is the field name, not the email address itself.

html
<!-- When the user fills in the "email" field, that value becomes the reply-to address -->
<input type="hidden" name="_replyto" value="email">

_cc

Comma-separated list of additional email addresses to CC on notification emails.

html
<input type="hidden" name="_cc" value="manager@company.com,support@company.com">

Automatically Stripped Fields

The following fields are automatically stripped from submission data and are never stored:

FieldPurpose
_csrf_tokenPhoenix/Rails CSRF tokens
_utf8UTF-8 encoding markers

Example: Full HTML Form

Here is a complete example using multiple field types and special fields:

html
<form action="https://app.krafter.dev/f/contact" method="POST">
  <!-- Honeypot (hidden from real users) -->
  <div style="position: absolute; left: -9999px;">
    <input type="text" name="_honeypot" tabindex="-1" autocomplete="off">
  </div>

  <!-- Redirect after submission -->
  <input type="hidden" name="_redirect" value="https://yoursite.com/thank-you">

  <!-- Custom notification subject -->
  <input type="hidden" name="_subject" value="New contact request">

  <!-- Use the email field as reply-to -->
  <input type="hidden" name="_replyto" value="email">

  <!-- Visible fields -->
  <label for="name">Name</label>
  <input type="text" id="name" name="name" required>

  <label for="email">Email</label>
  <input type="email" id="email" name="email" required>

  <label for="phone">Phone</label>
  <input type="tel" id="phone" name="phone">

  <label for="subject">Subject</label>
  <select id="subject" name="subject">
    <option value="general">General Inquiry</option>
    <option value="support">Support</option>
    <option value="sales">Sales</option>
  </select>

  <label for="message">Message</label>
  <textarea id="message" name="message" required></textarea>

  <label>
    <input type="checkbox" name="newsletter" value="yes">
    Subscribe to newsletter
  </label>

  <button type="submit">Send</button>
</form>

Built by Krafter Studio