How to set HTML5 attributes like 'required' using a Slim template

Question

I m laying out a form using the Slim template language and want to add the required attribute to my input.

input#first_name(required name="first_name" type="text" pattern="^[A-Z][a-z]+$")

However the HTML that is generated from this ends up being

 <input id="first_name" name="first_name" pattern="^[A-Z][a-z]+$" required="" type="text" />

And that's not what I need.

I've gone through the docs but can't see any way with Slim to add a standalone html5 attribute.

Likewise adding the data-abide attribute to the form tag (as required by the Zurb Foundation framework) fails.

form.custom(data-abide method="POST" action="/registration")

leads to

<form action="/registration" class="custom" data-abide="" method="POST">

Which the Zurb scripts ignore.

What am I missing?

Answer 1

In your *.html.slim file do:

input#first_name required="" name="first_name" type="text" pattern="^[A-Z][a-z]+$"

Note that empty attribute syntax:

<input required>

Is equivalent to:

<input required="">

Answer 2

More readable would be:

= f.input :email, required: true, autofocus: true