Returns an html input with an associated label. If there are errors associated with the field, it will also output a span tag with the errors.

Options

• :label - When given a keyword list, the keyword text is extracted to use as the label text. All other options are passed along to the label. When given false, does not create a label tag. Instead, an aria-label attribute is added to the input to improve accessibility.

• :validate - Defaults to application config. When provided a form created with an Ecto changeset that contains validations, then Formulator will add HTML5 validation attributes (except regex).

• :validate_regex - Defaults to application config. Like option :validate, except this will add a pattern HTML5 validation. This should work with most simple regex patterns, but the browser's regex engine may differ from Erlang's.

• :wrapper_class - This allows you to add a class to the div that wraps the input and label. This can also be set in your config: config :formulator, wrapper_class: "input-wrapper"

Examples

Basic input:

<%= input form, :name %>
#=> <div>
#=>   <label for="user_name">Name</label>
#=>   <input id="user_name" name="user[name]" type="text" value="">
#=> </div>

Without a label:

<%= input form, :name, label: false %>
#=> <div>
#=>   <input id="user_name" name="user[name]" aria-label="name" type="text" value="">
#=> </div>

Passing other options:

<%= input form, :name, label: [class: "control-label"] %>
#=> <div>
#=>   <label class="control-label" for="user_name">Name</label>
#=>   <input id="user_name" type="text" name="user[name]" value="">
#=> </div>

Using different input types:

<%= input form, :email_address,
    as: :email,
    placeholder: "your@email.com",
    class: "my-email-class",
    label: [class: "my-email-label-class"] %>
#=> <div>
#=>   <label
       class="my-email-label-class"
       for="user_email_address">Email Address</label>
#=>   <input
       id="user_email_address"
       type="email"
       name="user[email_address]"
       placeholder: "your@email.com"
       value=""
       class="my-email-class">
#=> </div>

Or a number input:

<%= input form, :count, as: :number %>
#=> <div>
#=>   <label for="asset_count">Count</label>
#=>   <input id="asset_count" type="number" name="asset[count]" value="">
#=> <div>

If your form is using a changeset with validations (eg, with Ecto and phoenix_ecto), then Formulator will add HTML5 validation attributes:

<%= input form, :email, as: :email %>
#=> <div>
#=>   <label for="user_email">Email</label>
#=>   <input id="user_email" type="email" name="user[email]" required="required" pattern=".+@.+" %>
#=> <div>

If you would rather not add HTML5 validation attributes, you can opt out by supplying validate: false:

<%= input form, :email, as: :email, validate: false %>
#=> <div>
#=>   <label for="user_email">Email</label>
#=>   <input id="user_email" type="email" name="user[email]" %>
#=> </div>

You may want HTML5 validations, but the browser's regex engine is not working with Elixir's regex engine. You can opt-out of regex validation with validate_regex: false:

<%= input form, :email, as: :email, validate_regex: false %>
#=> <div>
#=>   <label for="user_email">Email</label>
#=>   <input id="user_email" type="email" name="user[email]" required="required" %>
#=> </div>